Вложение блоков div попытка обработать стилями CSS подробности внутри

Всем здравия и процветания, появился вот такой вопрос, не знаю как подступится. Раньше я спрашивал про форматирование блоков div стилями css вот тут Блок div внутри div css форматирование сэкономить на количестве стилей

А теперь появилась чуть более сложная задача, не уверен что её можно решить только стилями CSS не прописывая класс или id самим div-ам.

В общем вот исходная конструкция

<table class="table_div">
<tbody>
<tr>
<td>

<div>заголовок1</div>
<div>
 <div>Характетистика1</div>
 <div>100</div>
</div>
<div>
 <div>Характетистика2</div>
 <div>200</div>
</div>
<div>
 <div>Характетистика3</div>
 <div>300</div>
</div>

<div>заголовок2</div>
<div>
 <div>Характетистика1</div>
 <div>100</div>
</div>
<div>
 <div>Характетистика2</div>
 <div>200</div>
</div>
<div>
 <div>Характетистика3</div>
 <div>300</div>
</div>

</td>
</tr>
</tbody>
</table>

Как видно характеристики идут блоками и их много, один блок с названием характеристик, за ним конструкция

<div>
<div></div>
<div></div>
</div>

... и дальше опять один блок с названием и т.д.

И вот добавившийся блок заголовок1 я тупо меняю на

ибо как ввести форматирования в стили его так и не допёр :(

В стилях прописано так как подсказали мне товарищи и особенно UModeL с ссылки выше, вот такая конструкция:

.table_div td {
    border: 1px dotted #cecece;
    text-align: left;
    vertical-align: top;
    margin: 3px;
    padding: 4px;
}
.table_div td h4 {
    font-size: 17px;
    font-weight: bold;
    color: #0046b0;
}
.table_div td > div {
  display: flex;
  font-size: 16px;
  border-bottom: dotted 1px #b2b2b2;
}

.table_div td > div > div:nth-of-type(1) {
  font-weight: bold;
  display: inline-block;
  margin: 3px;
  color: #1c1c1c;
}

.table_div td > div > div:nth-of-type(2) {
  display: inline-block;
  margin: 3px;
}

Как ввести в стили отдельный блок без того, что бы прописывать в него класс или id элемента не знаю, он идёт отдельным. Если менять к примеру шрифт в

table_div td > div

он меняется во всех блоках. Сейчас тупо вручную меняю заголовки на

заголовок

Если у кого будут мысли то поделитесь пожалуйста.

Со всем уважением с к сообществу!


Ответы (0 шт):