CSS---各种分割线
2016-01-21 17:51
555 查看
直接上代码:
<!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></title>
<style type="text/css">
<!--
.hr0{ height:1px;border:none;border-top:1px dashed #1E90FF;}
.hr1{ height:1px;border:none;border-top:1px solid #000;}
.hr2{ height:3px;border:none;border-top:3px double #6B8E23;}
.hr3{ height:5px;border:none;border-top:5px ridge #45D6D8;}
.hr4{ height:10px;border:none;border-top:10px groove #FF8C00;}
.hr5{ height:10px;border:none;border-top:10px groove #FF8C00;}
-->
</style>
</head>
<body>
<hr class="hr0" />
<hr class="hr1" />
<hr class="hr2" />
<hr class="hr3" />
<hr class="hr4" />
<hr align="center" width="1px" size="41px" color="#2f435b" style="border-
style:dotted;">
<hr align="center" width="1px" size="41px" noshade="noshade" style="border:1px #cccccc
dotted;">
</body>
</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></title>
<style type="text/css">
<!--
.hr0{ height:1px;border:none;border-top:1px dashed #1E90FF;}
.hr1{ height:1px;border:none;border-top:1px solid #000;}
.hr2{ height:3px;border:none;border-top:3px double #6B8E23;}
.hr3{ height:5px;border:none;border-top:5px ridge #45D6D8;}
.hr4{ height:10px;border:none;border-top:10px groove #FF8C00;}
.hr5{ height:10px;border:none;border-top:10px groove #FF8C00;}
-->
</style>
</head>
<body>
<hr class="hr0" />
<hr class="hr1" />
<hr class="hr2" />
<hr class="hr3" />
<hr class="hr4" />
<hr align="center" width="1px" size="41px" color="#2f435b" style="border-
style:dotted;">
<hr align="center" width="1px" size="41px" noshade="noshade" style="border:1px #cccccc
dotted;">
</body>
</html>
相关文章推荐
- css3中 resize 、outline-offset、outline align-items属性 inherit和auto的区别
- 一个TextView实现不同部分添加不同样式
- (webstorm的css编写插件)Emmet:HTML/CSS代码快速编写神器
- CSS中!important的使用 转
- CSS文本对齐text-align详解
- CSS3阴影 box-shadow的使用和技巧总结
- Make a website all about you.
- CSS 的overflow:hidden (清除浮动)
- css居中
- Dom2(页面加载事件,标签样式,刷新)
- 小三角如何实现--css-before-after
- SASS和SCSS
- 最全的CSS浏览器兼容问题
- CSS实现输入框的高亮效果-------Day50
- CSS line-height
- CSS禁止文字选择user-select应用
- css样式中font属性的简写规则
- HTML+CSS慕课网学习总结(一)
- css 浏览器兼容性hack写法
- AlertDialog对话框的几种样式