如何在HTML插入水平线?

记得有一次，在设计网站时，我想在文章中间添加一条分隔线，以便读者可以更清楚地看到文章的结构。
当时我就想知道如何添加这个分隔线。
突然，我想起了我学习HTML时，老师提到过
标签。
我立即检查了一下，知道事情再简单不过了。
如果在文章标题后添加
，则会自动出现一条水平线。
我还记得那一天，2 01 9 年5 月2 1 日，在我书房的电脑前。
后来我使用CSS调整了样式，使这些线条更加符合我网站的整体风格。
等一下，我突然想到一件事：如果我需要插入斜杠或曲线，我还能使用这个
标签吗？

html中hr怎么加粗 水平线hr的css加粗方法

显然，你必须依靠CSS来控制HTML
标签的粗细，而它本身并不能做任何事情。
其实有两种简单的方法：用height来增加高度或者用border来模拟边框。

我们来谈谈最重要的高度+背景颜色的组合。
去年我们运行了一个电子商务项目，并使用了这条 5 px 厚的分隔线。
效果非常直接，写完代码就可以立即看到效果。
还有一个就是border属性，这个属性非常灵活。
例如，border-top:3 px dashed 3 3 3 可以创建一条虚线。
去年我在一个活动页面上使用时，这个效果非常爆炸，但有一个非常关键的细节：旧版本的 IE 浏览器可能会将虚线变成实线。
使用前必须进行测试。
还有一个非常重要的细节。
例如，如果要创建带阴影的分割线，添加 box-shadow:0 2 px 4 px rgba (0,0,0,0.2 ) 即可立即创建三维效果。
说实话，有点复杂。
很多人都忘记了这个技巧。

一开始我以为背景色可以控制虚线样式，后来发现错了。
必须依靠边界系列属性。
等等，另一个使用 em 单位的响应式设计。
例如height:0.2 em可以适应不同的设备。
去年我们改了移动端页面，省去了很多麻烦。

建议不要盲目更改hr标签上的属性，它没有这个功能。
最好使用CSS类来统一管理样式，但不要过度设计。
页面上数十条不同样式的分隔线看起来会很难看。