html水平线 虚线

＜html＞
＜head＞＜title＞美丽的水平线＜/title＞＜/head＞
＜body＞
＜p＞一条没有阴影粗细为５像素，宽为整个文档一般的居中的水平线
＜／p＞
＜hr noshade size=5 align=center width=50%＞
＜/body＞
＜/html＞
<hr>属性：
size: 设置水平分隔线的高度，单位：像素默认值是2
width: 设置水平分隔线的宽度， 单位：像素 % 默认值是100%
align: 设置水平分隔线的对齐方式。 默认值是center 还有left right
color: 设置水平分隔线的颜色。 默认值是black
noshade: 取消水平线的3d阴影

例：<hr size=1 color=redwidth=300>
显示效果如下：

 

---

 

如果想要垂直的线，可以这样来进行设置：
例：
<hr size=50color=red width=3align=center>
效果如下：

 

---

 

我们经常也用<hr>来进行设置虚线
可由以下几种方法：

最简单一种： <hr width=150style="border:1px dashed red;height:1px">

<hr style="border: 1px dashed #ccc; width: 100%;height: 1px;" />
效果如下：

 

---

 

dashed为虚线的意思 red就是直接定义的颜色
还有一种：
<hr style="BORDER-BOTTOM-STYLE: dotted;BORDER-LEFT-STYLE: dotted; BORDER-RIGHT-STYLE: dotted;BORDER-TOP-STYLE: dotted" color=blue size=1width=80>

效果如下：

 

---

 

再一种就是利用css来进行控制：
例：
<STYLE type=text/css>
.dotline {
BORDER-BOTTOM-STYLE: dotted; BORDER-LEFT-STYLE: dotted;BORDER-RIGHT-STYLE: dotted; BORDER-TOP-STYLE: dotted
}
</STYLE>

而在使用时，：<hr class=dotline color=green size=3width=200>

原文地址：http://blog.sina.com.cn/s/blog_72ce76690100rdbh.html