表の枠線の重複に対する解決策 css_html/css_WEB-ITnose

1. td の境界線がテーブル

の境界線と重なっています

.table { border-left:1px Solid #dedede; border-top:1px Solid #dedede;}

.td { border-right:1px Solid # dedede ; border-bottom:1px Solid #dedede;}

table は左の境界線と上の境界線のみを使用し、各 TD には右の境界線と下の境界線のみが含まれるという効果があります。 table は連続した実線で、右と下の境界線は td に続く境界線は断続的です

解決策:

.table {border:1px border-collapse:collapse;}

.td {border: 1px ソリッド #dedede; } オレンジ色のフォントがキーで、境界線の設定を上下左右に分ける必要がなくなりました。

Firefox の場合: td の境界線がもう一方を覆います。表と IE の表の境界線が TD を覆います。ここでの境界線の色は同じです。問題ありません。

表の線 よくある質問:

1. 表の境界線と表のセルの線が重なっています。 [border-collapse:collapseを使用して解決します]

2. ネストされたテーブルとネストされたテーブルのエッジが重なる問題。 [border-top|left|right|bottom を使用して解決します]

3. ネストされたテーブルとネストされたテーブルの間の位置ずれの問題。 [table-layout:fixed を使用して解決します]

4.border-collapse には、separate と Collapse の 2 つの属性があります。

分割はデフォルトの属性です。テーブル レイアウトの時代には、テーブルの背景色を設定して、ブロックの外側の境界線を押し出しました。テーブルの境界線の隙間を削除します。これにより、テーブルの td 境界線に値を代入するときに二重線枠が生成されなくなります。

デモ: 折りたたみ属性が設定されていない 2 行のテーブル