![网页设计与制作教程:Web前端开发(第7版)](https://wfqqreader-1252317822.image.myqcloud.com/cover/945/50604945/b_50604945.jpg)
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人
2.1.3 水平线元素hr
hr元素创建一条水平标尺线(horizontal rules),可以在视觉上将文档分隔成不同部分。水平线元素的格式为:
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/26_01.jpg?sign=1738890128-lj4ghhbsAinT7p3EnVxyugY7W0lA1AbQ-0-e28ebfac3762f29749b087b81f5e5ea7)
在HTML5中,<hr>标签的语义表示一个段落级主题的分隔(例如一个故事的场景转换或者一个主题的切换)。
推荐使用CSS来设置<hr>标签的视觉效果,如线条的粗细、长度、颜色等。
【例2-3】hr元素的基本用法示例。本例文件2-3.html的代码如下,在浏览器中显示的效果如图2-3所示。
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/26_02.jpg?sign=1738890128-hz4QCypAiQiq8QkfnDI0RYjWQs73vFd4-0-e86625e2c7b7b8be55994c0eb520f104)
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/26_03.jpg?sign=1738890128-y5UhHgLAZMhY82Z0z2e4xaxSOVjy7TdF-0-7703ce0b766df0042c9390988dc17cf5)
图2-3 水平线元素示例
在此示例中,<hr>标签用于在每个段落之间插入一条水平线,这有助于视觉上区分它们。此外,<hr>标签在HTML文档中创建了一个换行,这将使文本重新回到其默认的对齐方式(通常为左对齐)。
在HTML5中,<hr>标签的所有显示属性都可以使用,但推荐使用CSS来设置。