2

これを参照してください：http：//jsfiddle.net/ymSpY/。あなたが見ることができるならば<td>、内部テーブルがあります。内部テーブルは、親テーブルからスタイルを継承します。内側のテーブルには境界線があります。境界線を非表示にしたり、削除したりするにはどうすればよいですか？内側のテーブルのマークアップを見ることができるように、それは持っていてstyle="border-collapse: collapse;"、私も試しborder=0 ましたが、機能しません。内側/子テーブルの境界はまだそこにあります。

4

4 に答える 4

6

ルールは、直接の子供にのみ適用できます。

.dataTable > thead, 
.dataTable > thead > tr > th, 
.dataTable > tbody, 
.dataTable > tbody > tr > td {
    padding:       2px;
    border-top:    1px solid #F5F2EF;
    border-left:   1px solid #F5F2EF;
    border-bottom: 1px solid #F5F2EF;
    border-right:  1px solid #F5F2EF;
}

このように、境界ルールはネストされたテーブルに流れ落ちません。他の唯一のオプションは、たくさんのリセットを行うことです。これにより、CSSがすぐにkudzuに変わります。

デモ： http： //jsfiddle.net/ymSpY/10/

于 2012-05-16T06:23:33.387 に答える
2

おそらく子テーブル用に別のクラスを作成しますが、それを除いて、次の1つの解決策があります。

.dataTable td table, .dataTable td table tbody, .dataTable td table td {
    border:none;
}

http://jsfiddle.net/ymSpY/6/

編集：これは子テーブル用に定義されたクラスを持つものです。これにより、メインのdataTableに他の要素を追加し始めると、柔軟性が向上する可能性があります。 http://jsfiddle.net/ymSpY/11/

于 2012-05-16T06:30:50.647 に答える
1

よくわかりません。境界線の色を変更したので、代わりに0に設定してみませんか？

.dataTable td table td {
    border-top: 0;
    border-left: 0;
    border-bottom: 0;
    border-right: 0;
}

例http://jsfiddle.net/ymSpY/4/

于 2012-05-16T06:25:13.003 に答える
0

これは、ブートストラップを使用してUIのスタイルを設定している場合に機能します。

table.noborder td {
    border: none !important;
}

table.noborder td table.table td {
    border: 1px solid #dee2e6 !important;
}
于 2021-08-27T15:50:03.327 に答える