hr 标签的使用

---

标签可以产生一条分割线，并且可以设置颜色，位置，粗细
今天在使用hr标签的时候出现了问题，在网页中每个横线的显示是一样的，转成pdf格式之后，本来蓝色的线条，有的显示为蓝色，有的显示为灰色，放大后颜色一样，但是有一个灰色的边框。
原因：hr是一个块级元素，本身有默认的边框，颜色为灰色。

（1）可以通过高度首先设为0 然后设置边框的颜色 这样就不会出现灰色边框

 hr{ height:0px;  border-top:5px solid #31AFFC; }

（2）把边框设置为0，设置hr的高度，然后使用背景色实现显示

 hr{  border:0;  height:3px; text-align:center; background-color:#31AFFC;}

（3）

#two{border:none;height:3px;background-color:#CC0099;}/* CSS Document */#three{ height:0px;  border-top:5px solid #31AFFC; }#four{ height:10px; background-color:white;}

第一种是默认的，第二个和第三个是去掉边框自己设置的，这样不会出现导出pdf的时候颜色样式不一样。
第四个是只设置了高度和背景颜色，可以看出默认的灰色边框。（PS：图片上传一直失败！！！！）