枠線の太さを指定する

border-top-width: 太さ
 ⇔　上の枠線の太さ
border-bottom-width:　太さ
 ⇔　下の枠線の太さ
border-left-width:　太さ
 ⇔　左の枠線の太さ
border-right-width:　太さ
 ⇔　右の枠線の太さ
border-width:　太さ
 ⇔　上・右・下・左の枠線の太さ

太さ　　　　単位付きの数値・thin ・ medium ・ thick

これらのプロパティは枠線の太さの設定をします。
「border-width」を利用すると、上下左右の枠線の太さを一度に設定することが出来ます。
その場合、値を半角スペースで区切って指定しますが、与えられた値の個数によって、
次の様に枠線の太さが設定されます。
●値が１つの場合
●値が２つの場合
●値が３つの場合
●値が４つの場合		 値１⇒上下左右
値１⇒上下　値２⇒左右
値１⇒上　値２⇒左右　値３⇒下
値１⇒上　値２⇒右　値３⇒下　値４⇒左
「thin」「medium」「thick」は、それぞれ「細い枠線」「中くらいの枠線」「太い枠線」に設定します。
この場合の実際の太さは、プラウザによって異なります。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<title>CSS覚書</title>
<style type="text/css">
<!--
body {
color: #ff6600;
margin: 10
}
p {
text-align: center;
font-weight: bold;
padding: 0.5em;
border: solid 3px #000000;
color: #ffffff;
background: #ff3300
}
#sample1 { border-width: 1px }
#sample2 { border-width: thin }
#sample3 { border-width: medium }
#sample4 { border-width: thick }
#sample5 { border-width: 1em }
#sample6 {
border-left-width: 100px;
border-right-width: 0;
}
h1 { text-align: center }
-->
</style>
</herd>
<body>
<h1>枠線の太さを指定する</h1>
<p id="sample1">上下左右の枠の太さ：１ピクセル</p>
<p id="sample2">上下左右の枠の太さ：thin</p>
<p id="sample3">上下左右の枠の太さ：medium(初期値）</p>
<p id="sample4">上下左右の枠の太さ：thick</p>
<p id="sample5">上下左右の枠の太さ：1em</p>
<p id="sample6">左：100ピクセル　右：0</p>
</body>
</html>