HTML 关于hr标签,虚线

时间::2011-08-03 栏目: 技术分享 作者: ↗℡ 浮华 青春 评论: 1 点击: 6957 次

hr标签是单独使用的标签,是水平线标签,用于段落与段落之间的分隔,使文档结构清晰明了,使文字的编排更整齐
通过设置hr标签的属性值,可以控制水平分隔线的样式。

hr属性:
size: 设置水平分隔线的高度,单位:像素 默认值是2
width: 设置水平分隔线的宽度, 单位:像素 % 默认值是100%
align: 设置水平分隔线的对齐方式。 默认值是center 还有left right
color: 设置水平分隔线的颜色。 默认值是black
noshade: 取消水平线的3d阴影

例:hr size=1 color=red width=300
显示效果如下:



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




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

最简单一种:hr width=150 style="border:1px dashed red; 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=1 width=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=3 width=200

声明: 本文由(↗℡ 浮华 青春)原创编译,转载请保留链接: HTML 关于hr标签,虚线

(选择后可查看结果)阅读本文后,您的心情是:
 
恶心
愤怒
强赞
感动
路过
无聊
雷囧
关注
et_highlighter51

HTML 关于hr标签,虚线:目前有 1 条留言

  1. # 沙发
    腰椎病博客:

    呵呵·学到东西咯··谢谢博主分享··我是网页设计的初学者·嘿嘿·

    2011-08-13 23:06 [回复]

发表评论

------====== 本站公告 ======------
博主大学蜕变期间,更新量应该骤减,表示十分可怕。2016,一起加油!

北京时间

    敢于浪费哪怕一个钟头时间的人,说明他还不懂得珍惜时间的全部价值。

    ——达尔文