HTML 表の境界線
HTML テーブルには、さまざまなスタイルと形状の境界線を含めることができます。
ボーダーを追加する方法
表に罫線を追加すると、表の各セルの周囲にも罫線が追加されます。
ボーダーを追加するには、table、th、td要素にCSSのborderプロパティを使用します：
折りたたまれた表の境界線
上記の例のように二重の境界線が表示されないようにするには、CSSの border-collapseプロパティをcollapseに設定します。
これにより、境界線が単一の境界線に折りたたまれます。
スタイル表の境界線
各セルの背景色を設定し、境界線に白い色(ドキュメントの背景と同じ)を指定すると、境界線が見えない印象になります。
例
table, th, td {
border: 1px solid white;
border-collapse: collapse;
}
th, td {
background-color: #96D4D4;
}
円卓の縁取り
border-radiusプロパティを使用すると、境界線の角が丸くなります。
CSSセレクターからtableを除外してテーブルの周りの境界線をスキップします
点線の表枠
border-styleプロパティで、境界線の外観を設定できます。
次の値が許可されています。
dotteddashedsoliddoublegrooveridgeinsetoutsetnonehidden
border-color
border-colorプロパティで、境界線の色を設定できます。