CSS 枠線幅

CSS 枠線幅

border-width 属性は4つの境界線の幅を指定します。

幅を特定のサイズ（px、pt、cm、emで指定）に設定することもできますが、以下の3つのプレセット値のうちの1つを使用することもできます：薄い、中程度、または厚い：

インスタンス

異なる境界線幅を示す：

p.one {
  border-style: solid;
  境界線幅: 5ピクセル;
}
p.two {
  border-style: solid;
  境界線幅: 中程度;
}
p.three {
  境界線スタイル: 点線;
  境界線幅: 2ピクセル;
} 
p.four {
  境界線スタイル: 点線;
  境界線幅: 厚い;
}

結果：

5ピクセル境界線幅

中程度界線幅

2ピクセル境界線幅

厚い境界線幅

自分で試してみる

特定の辺の幅

border-width 属性は1から4つの値を設定できます（上枠、右枠、下枠、左枠用）：

インスタンス

p.one {
  border-style: solid;
  border-width: 5px 20px; /* 上枠と下枠が 5px、他の枠が 20px */
}
p.two {
  border-style: solid;
  border-width: 20px 5px; /* 上枠と下枠が 20px、他の枠が 5px */
}
p.three {
  border-style: solid;
  border-width: 25px 10px 4px 35px; /* 上枠 25px、右枠 10px、下枠 4px、左枠 35px */
}

自分で試してみる