html语言hr的用法,htmlhr各种样式使用 - 米扑博客

网页设计时，会用到hr的各种样式，如果使用得当，将会给你的页面增色很多！

hr 属性

属性解释：

width:60%;     hr的宽度，即上图红色宽度为上一级宽度的60%

height:5px;      hr的高度，即上图中间白色部分为高度2px

border:5px solid #ff0000;    hr的边框，即上图中红色边框，宽度为5px

border-top:2px dotted #0066CC;    hr的上边框，即上图蓝色点线的2px上边框，其覆盖了红色5px的边框

dotted  点线，其它还有虚线(dashed)、实线(solid)

#0066CC  虚线的颜色

color=#00ffff 虚线的内部颜色，即上图2的蓝色

size=20  虚线的厚度，即上图2的蓝色高度

align=left  虚线的对齐方式，支持 left、center、right

简单示例

上图，构建虚线解释如下：

最上面，border-top:2px dotted #0066CC;构建点线，高度为2px；height:2px高度为2px，不显示

中间的，border:1px dotted #0066CC;构建点线，高度为0

最下面，border:2px dotted #0066CC;构建上下点线，高度为2px；height:2px高度为2px，为border包含的中间白色部分

示例样式

border-top:10px grooveskyblue;   groove  上颜色        skyblue   下颜色

本文示例效果，请参见米扑示例：

本文示例颜色，请参考米扑博客：