Упорядочить нумерацию списка

@mkostya · Регистрация: 20.07.2016

Author24 — интернет-сервис помощи студентам

Есть вот такой заголовок:
Название: 123.jpg
Просмотров: 18

Размер: 1.9 Кб

Описывается тегами:

HTML5

<ol>
   <li>
       <p></p>
       <h2>Заголовок</h2>
       <p></p>
   </li>

Проблема в том, что на числа (нумерация) не в стиле заголовка.
Подскажите, каким селектором распространить стиль заголовка на нумерацию?
При этом если нумерованный список есть в обычном тексте, то стиль заголовка на него, конечно, не должен распространяться.

@boilzzz · 20.07.2016, 12:03

mkostya, Не проще делать это не списком? а просто добавить цифру и точку перед заголовком.

@mrtoxas · 20.07.2016, 12:08

Можно так

CSS

ol {
  list-style-type: none;
  counter-reset: list 0;
}
 
ol li:before {
  counter-increment: list;
  content: counter(list) ". ";  
  font-weight:bold;
  font-size:1.5em;
  vertical-align:bottom
}
h2{
  display:inline-block;
  margin:0;
}

HTML5

<ol>
  <li>
    <h2>Заголовок1</h2>
  </li>
  <li>
    <h2>Заголовок2</h2>
  </li>
</ol>

песочница

@Fedor92 · 20.07.2016, 12:14

mkostya, и что мешает для списка и заголовка задать аналогичный стиль? Минимизированный вариант до кучи...

HTML5

<!DOCTYPE html>
<html lang="ru">
    <head>
        <meta charset="utf-8">
        <title>list</title>
        <style>
            ol, h2{font:bold 24px Tahoma}
            p{font:14px Tahoma}
        </style>
    </head>
    <body>
        <ol>
           <li>
               <p></p>
               <h2>Заголовок</h2>
               <p></p>
           </li>
        </ol>
    </body>
</html>

@boilzzz Богатый духовно 455 / 262 / 145 Регистрация: 10.03.2015 Сообщений: 1,057
	20.07.2016, 12:03	2
	mkostya, Не проще делать это не списком? а просто добавить цифру и точку перед заголовком. 0

	20.07.2016, 12:14