どのように私は改善したいCSSコードを持つテーブル

Question

のCSSスタイルを簡素化します。実際、このコードはChromeスタイルのインスペクタからコピー貼り付けされていました。しかし、私は、「クリーン」なスタイルを取得するためにネスト使って一つのルールにそれを簡素化しようとするとこだわっている：

.table > thead > tr > th, .table > thead > tr > td, 
.table > tbody > tr > th, .table > tbody > tr > td, 
.table > tfoot > tr > th, .table > tfoot > tr > td { 
    border-top: 1px solid #000; 
} 

は、それがsimplierにする方法はありますか？テーブルで

Answer 1

我々は<thead>、<tbody>と<tfoot>に<th>と<td>を見つけ、上記のCSSのすべてのものは、単にこれは、テーブル内のすべての<th>と<td>を対象とします。この

.table th, .table td{ 
    border-top: 1px solid #000; 
} 

使用していないので、なぜターゲットとしています。

Answer 2

あなたがテーブルからすべての部品に

.table th, 
.table td { 
    border-top: 1px solid #000; 
} 

Answer 3

.table th, 
.table td { 
    border-top: 1px solid #000; 
} 

を選択しているとして、あなたはthead内thをターゲットしたい場合、あなたは

.table thead th, 
.table thead td { 
    border-top: 1px solid #ccc; 
} 

同じように使用することができ、中央部分を省略することができますがtbodyでありますtfootとなります。その中に何かを上書きしたい場合は、次のようにしてください：

.table tbody th, 
.table tbody td { 
    border-top: 1px solid #ddd; 
} 
.table tfoot th, 
.table tfoot td { 
    border-top: 1px solid #eee; 
}