何时在语义上使用hr元素是正确的？

Question

HTML5 reference说

  

hr元素表示段落级主题中断，例如故事中的场景变化，或者参考书的某个部分内的另一个主题的过渡。

这种描述不足以描述我。我在HTML文档中使用hr元素作为分隔内容的方法。这是对的吗？

有人可以举几个例子来说明何时使用它（除了显示的例子）以及何时使用CSS样式？

Answer 1

当你有几个段落有两个截然不同的主题时，使用它是合适的。

<p>Paragraph about domestic kittens</p>
<p>Paragraph about kittens' favourite foods</p>
<p>Paragraph about kittens' playfulness</p>
<hr>
<p>Paragraph about my day at work</p>

如果你想在图像和内容之间分开主题，我相信这也是合适的。

<img src="/img/kitten.jpg" alt="kitten playing with ball">
<img src="/img/kitten1.jpg" alt="kitten drinking milk">
<hr>
<img src="/img/zebra.jpg" alt="zebras in the wild">

hr的新用法似乎只是用于区分HTML中的主题。如果您发现内容连接良好，请不要觉得需要使用标记。

Answer 2

根据this article

  

在HTML 4.01中，<hr>标记代表水平规则。

     

在HTML5中，<hr>标记定义了主题中断。

     

但是，<hr>标记仍可能会显示为水平规则   视觉浏览器，但现在以语义术语定义，而不是   表述术语。

     

HTML 4.01中的所有布局属性（对齐，noshade，大小和宽度）   在HTML 4.01中已弃用，HTML5不支持。使用CSS来   另外设置<hr>元素的样式。

在HTML5中，当您从先前编写的段落中转移主题时，请使用<hr>。

Answer 3

我的简短回答以及我采用的方式是，当没有其他方法可以用CSS干净地完成时，我使用<hr>。对我来说，这已经转化为多年编写HTML并且永远不必使用<hr>。

最终，如果我只想在相同内容的两个部分之间添加某种标记，我可以看到自己使用<hr>。

使用博客文章的示例：当我认为从一个主题过渡到另一个主题时，我会提出<hr>。