Как упростить стиль 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; 
} 

Есть ли способ сделать это проще?

Answer 1

В таблице мы находим <th> и <td> в <thead>, <tbody> и <tfoot> и выше CSS все вещи ориентированы так почему бы просто не использовать этот

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

Это также будет нацелен на все <th> и <td> в таблице.

Answer 2

Вы можете опустить среднюю часть, как вы выбираете все детали из таблицы

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

Answer 3

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

Если хочет предназначаться th внутри thead, то вы можете использовать

.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; 
}