CSS定义HR水平线的几种样式
2013-04-23 14:24
218 查看
CSS定义HR水平线的几种样式,不要小看了HR水平线哦,用好了会给你的网页增色不少,这一段代码分别定义了几种漂亮的HR样式及颜色,供你参考,如果喜欢,直接拷贝代码就用吧。
效果如下
![](http://img1.51cto.com/attachment/201304/143002817.jpg)
效果如下
![](http://img1.51cto.com/attachment/201304/143002817.jpg)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>CSS定义HR水平线</title> <style type="text/css"> <!-- .hr0{ height:1px;border:none;border-top:1px dashed #0066CC;} .hr1{ height:1px;border:none;border-top:1px solid #555555;} .hr2{ height:3px;border:none;border-top:3px double red;} .hr3{ height:5px;border:none;border-top:5px ridge green;} .hr4{ height:10px;border:none;border-top:10px groove skyblue;} --> </style> </head> <body> <hr class="hr0" /> <hr class="hr1" /> <hr class="hr2" /> <hr class="hr3" /> <hr class="hr4" /> </body> </html>
相关文章推荐
- css 定义hr的几种样式
- 定义HR水平线的几种样式
- 在网页中页中加入CSS有几种方法!以及在样式定义有冲突时的优先级如何分配!
- CSS三种漂亮的<hr>水平线样式
- CSS定义超链接样式的顺序以及四个伪类的介绍
- 【经验】在CSS中定义超链接样式a:link、a:visited、a:hover、a:active的顺序
- css控制水平衡线hr标签样式去掉阴影效果
- Flex中的CSS: (9)可继承/不可继承样式的定义 以及Flex中的实现方法 1
- css控制水平衡线hr标签样式去掉其阴影效果
- 第5章—通过CSS定义链接样式
- 引用外部CSS样式,定义的效果无效
- CSS中a标签的样式简介 链接定义的顺序
- [待整理]CSS定义了超链接A标记的样式
- CSS定义鼠标经过时鼠标图形的十五种样式整理
- CSS定义鼠标经过时鼠标图型样式
- 在flex定义样式的几种方法
- 分析总结一下<li>和<hr>的样式定义
- CSS样式定义的优先级顺序总结
- CSS定义鼠标经过时鼠标图型样式
- 用标准的CSS定义你的表格样式