HTML的hr标签可以创建一条水平线。下面,我们来看看html中hr的各种样式使用吧。
01创建一条水平线
先使用<hr/>标签来创建一条水平线,如下图所示:
02hr的高度
使用style来设置hr水平线的样式,比如设置hr的高度, <hr style=" height:30px" />。如下图所示:
03没有边框
使用border:none来设置hr没有边框,如下图所示:
04dotted 虚线
使用dotted将水平线设置成虚线,如下图所示:
这个方法有好多!具体的在下面给你展示下:第一种:
<hr style=" height:2pxborder:noneborder-top:2px dotted #185598" />
height:2px//是hr的高度
border:none // 是没有边框
border-top:2px dotted #185598 //是设置横线的样式
dotted 虚线 #185598 颜色
第二种:
<hr style="height:1pxborder:noneborder-top:1px dashed #0066CC" />
第三种:
<hr style="height:1pxborder:noneborder-top:1px solid #555555" />
第四种:
<hr style="height:3pxborder:noneborder-top:3px double red" />
第五种:
<hr style="height:5pxborder:noneborder-top:5px ridge green" />
第六种:
<hr style="height:10pxborder:noneborder-top:10px groove skyblue" />
border-top:10px groove skyblue groove 上颜色skyblue 下颜色