Правильное использование тега HTML5 <hr>

Я пишу новую веб-страницу для компании, и у меня есть (разумное подмножество) рекомендаций HTML5/W3C.

После прочтения семантического значения <hr /> мне было интересно, было ли это хорошим местом для его использования:

<section name="historyItem">
    <h2>2002</h2>
    <p>Dolorem ipsum dolor sit amet in 2002, consectetur [...]</p>
    <hr />
    <ul>
        <li><a href="#">Link A</a></li>
        <li><a href="#">Link B</a></li>
    </ul>
</section>

Моя линия рассуждений такова, что да, <hr /> представляет собой тематическое изменение из описания раздела к ссылкам раздела, но я не уверен в этом.

Возможно, "тематическое изменение" означает новый абзац позже на другой предмет, и поэтому мой пример не будет "правильным". Как вы думаете?

(ps.: Да, этот <ul> имеет CSS-стиль, подходящий для одной строки и выглядящий круто)

Ответы

Ответ 1

Я понимаю, что вы имеете в виду. Но лично я просто не стал бы беспокоиться. Спросите себя, почему вы используете тег в первую очередь. Если вы хотите определить изменение между абзацем и ссылками, то с точки зрения чистой наценки я не считаю это необходимым. Если речь идет о внешнем виде вашей страницы (т.е. Вы хотите разграничить две области), я снова задаю вопрос о ее полезности, учитывая, что вы можете применить границу к тегам абзаца или неупорядоченного списка.

Конечно, учитывая, что это html5, вы можете пройти весь свиньи и использовать тег <section>...

Ответ 2

Тематически говоря, <hr> означает конец одного "раздела" и начало "другого". По существу они должны появляться после тэгов <section>, а не внутри. Хотя семантически говоря, на самом деле не важно, где вы хотите их использовать.

Если ваш список элементов ссылок относится к элементам ВЫШЕ тег <hr> (что имеет значение для других элементов в теге <section>, тогда я не рекомендую использовать <hr> там. Вместо этого используйте CSS для дифференцировать границу и подчеркивать.

Если вам нужна дополнительная ссылка, я нашел это для вас: http://html5doctor.com/small-hr-element/

Cheers, D