一些html中简单的hr分割线样式，方便以后自用！修改相关的颜色、距离、粗细代码，可以实现不同的显示效果。

一.点状虚线

<hr style=" height:2px;border:none;border-top:2px dotted #185598;" />

二、细分离双线

<hr style="height:3px;border:none;border-top:3px double red;" />

三、粗连接双线

<hr style="height:10px;border:none;border-top:10px groove skyblue;" />

四、渐变线

<hr style="border: 0;height: 2px;background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));" />

五、带阴影的分割线

<hr style=" border: 0; padding-top: 10px;color: #d0d0d5;border-top: 1px solid rgba(0,0,0,.1);box-shadow: inset 0 10px 10px -10px" />

六、双虚线

<hr style="height:2px;border:2px dotted #0066CC;" />