WD1X.COM - 问答一下,轻松解决,电脑应用解决专家
主板显卡CPU内存显示器
硬盘维修显卡维修显示器维修
注册表系统命令DOS命令Win8
存储光存储鼠标键盘
内存维修打印机维修
WinXPWin7Win11Linux
硬件综合机箱电源散热器手机数码
主板维修CPU维修键盘鼠标维修
Word教程Excel教程PowerPointWPS
网络工具系统工具图像工具
数据库javascript服务器
PHP教程CSS教程XML教程

HTML 关于<hr>标签,虚线

更新时间:2021-06-08 13:36 作者:佚名点击:
hr标签是单独使用的标签,是水平线标签,用于段落与段落之间的分隔,使文档结构清晰明了,使文字的编排更整齐
通过设置<hr>标签的属性值,可以控制水平分隔线的样式。

<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>来进行设置虚线
可由以下几种方法:

最简单一种: <hrwidth=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=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=greensize=3 width=200>
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
你可能感兴趣的内容