会员投稿
投稿指南 
RSS订阅栏目导航
热点推荐
- 3个简单却重要的CSS技巧
- css基础:熟悉了解盒子模型(box m
- CSS Hack兼容各浏览器是否正常
- 最常用的12种CSS BUG解决方法与
- [分享]我的css hack观点
- CSS实例教程:分号引起页面混乱
- CSS教程：认真学习haslayout
- CSS教程:编写CSS代码时样式命名
- 如何在CSS中设定文本的尺寸
- CSS教程:CSS定位属性
- 新窗口打开超链接的正确方法
- 轻松搞定IE的CSS制作网页技巧3则
阅览排行
CSS定义HR水平线的几种样式
www.jz123.cn 2009-08-11 来源: 中国建站 责任编辑(袁袁) 我要投递新闻
对于CSS定义<hr />水平线标签，常用的有以下几种样式，仅供参考。对于
程序代码
height:1px;border:none;
的主要用途就是Css Reset，关于Css Reset可以搜索下博客里其他文章介绍。
HTML代码
| <!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> |
0
上一篇：语义化的HTML结构到底有何好处? 下一篇：HTML5和CSS3让网页设计提升到下一个高度