php hr样式虚线,CSS的虚线样式怎么实现

说到CSS的虚线样式,那么我们会联想到border的solid,在网页的布局里solid用的概率应该是最高的了,但是大家知道还有dotted虚线和ashed虚线吗?今天来给大家介绍这俩种属性做出虚线的方法。

讲到css虚线样式,应该会想到border的solid,网页布局中solid用的概率最高了,要有css虚线的效果还可以用图片做背,但是不推荐,尽量使用css虚线样式做这个虚线的效果,那么css虚线样式就是border中的dotted和dashed,这两种都是css虚线,但是他们是有区别的。

1.dotted虚线

dotted虚线

*{

margin:100px;

padding:0;

}

body{

width:1000px;

margin:0 auto;

}

.box{

width:300px;height:50px;

text-align:center;

padding-top:30px;

border:1px dotted #000;

}

大家好,我是dotted虚线!

2.dashed虚线

dashed虚线

*{

margin:100px;

padding:0;

}

body{

width:1000px;

margin:0 auto;

}

.box{

width:300px;height:50px;

text-align:center;

padding-top:30px;

border:1px dashed #000;

}

大家好,我是dashed虚线!

相信看了这些案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

相关阅读: