HTML テーブル境界制御実装コード

一般的に、テーブルを使用する場合は、常に <table border="1"> などの border 属性を指定します。その効果は次のようになります。

テーブルの境界線が非常に広いことがわかります。もちろん、ここでの「非常に広い」は、テーブルの境界線の幅ではありません。表示されている幅は、おそらく <td> タグ間のギャップによるものです。したがって、テーブルの cellspacing 属性、つまり <table border="1px" cellspacing="0px"> を変更するだけで、効果は次のようになります。

しかし、幅は想像していたほど広くなく、たった 1 ピクセルの幅しかないようです。実際、上の画像で見られる幅は 2 ピクセルです。なぜでしょうか? これは、<td> 間の境界線が重なっていないためです。テーブルの border-collapse プロパティを変更するだけです。

つまり、<table border="1px" cellspacing="0px" style="border-collapse:collapse">

表に色を追加します。<table border="1px" bordercolor="#000000" cellspacing="0px" style="border-collapse:collapse">