borderのプロパティのあれこれ

基本的なborder記述方法

border-widthにはborderの大きさを書く。
border-styleにはborderのスタイルを書く。（後述）
border-colorにはborderの色を書く。

border: border-width border-style border-color;

一部分のみに適用することもできる。

border-top: 3px solid #333; 
border-right: 3px solid #333; 
border-bottom: 3px solid #333; 
border-left: 3px solid #333;

プロパティ	概要
`none`	ボーダーを表示しない。
`hidden`	ボーダーを非表示にする。 `outline`プロパティを使った場合には表示される。（ほとんどの場合、`hidden`を使用することはない）。
`solid`	実線のボーダー。
`dashed`	破線のボーダー。
`dotted`	点線のボーダー。
`double`	二重線のボーダー。
`groove`	立ち上がっているように見える、立体的なボーダー。
`ridge`	沈み込んでいるように見える、立体的なボーダー。
`inset`	要素に沈み込んでいるように見える、ボーダー。
`outset`	要素が突き出ているように見える、ボーダー。

borderを角丸にするにはborder-radiusプロパティを使用する。

border-radius: 100px;

なお特定の部分だけ角丸にする場合は以下のように指定する。

border-radius: 100px 100px 0 0;