html横线代码

2022-11-17 14:12:18 浏览数 (3)

第一种:园点虚线代码


代码语言:javascript复制
<hr style="height: 2px; border: none; border-top: 2px dotted #185598;" /><hr style="height: 2px; border: none; border-top: 2px dotted #185598;" />

height:2px;hr的高度 border:none;是没有边框 border-top:2px dotted #185598;是设置横线的样式 dotted 虚线 #185598 颜色

第二种:块虚线代码


代码语言:javascript复制
<hr style="height: 1px; border: none; border-top: 1px dashed #0066CC;" /><hr style="height: 1px; border: none; border-top: 1px dashed #0066CC;" />

第三种:实线,一条直线代码


代码语言:javascript复制
<hr style="height: 1px; border: none; border-top: 1px solid #555555;" /><hr style="height: 1px; border: none; border-top: 1px solid #555555;" />

第四种:两条紧密实线代码


代码语言:javascript复制
<hr style="height: 3px; border: none; border-top: 3px double red;" /><hr style="height: 3px; border: none; border-top: 3px double red;" />

第五种:两种颜色代码


代码语言:javascript复制
<hr style="height: 5px; border: none; border-top: 5px ridge green;" /><hr style="height: 5px; border: none; border-top: 5px ridge green;" />

第六种:两种颜色代码


代码语言:javascript复制
<hr style="height: 10px; border: none; border-top: 10px groove skyblue;" /><hr style="height: 10px; border: none; border-top: 10px groove skyblue;" />

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

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

0 人点赞