请问一下网页中的圆点虚线用CSS怎么做?

html-css08

请问一下网页中的圆点虚线用CSS怎么做?,第1张

border线型主要有:

1、dotted【点状】

2、solid【实线】

3、double【双实线】

4、dashed【虚线】

实例一:如果一个CSS这样写:border-style:dotted solid double dashed出来的框就是:上边框是点状,右边框是实线,下边框是双线,左边框是虚线

实例二:如果一个CSS这样写:border-bottom:1px dashed #000000出来的框就是:一条宽度为1像素的黑色下划虚线。

以此类推。多试试就知道什么效果了哦。

那就看你要怎么去实现这个虚线了,比如实现虚线的方式有用div,有hr水平线方式。\x0d\x0adiv的方式就可以这样写: border-top:1px #ccc dashed,只留一条边可见,其它边不可见,虚线的属性是 dashed\x0d\x0a如果你用hr实现也是可以的,同样也可以在样式里写 dashed属性值\x0d\x0a这样就实现虚线了。

直接运用CSS中的文本修饰属性text-decoration是没有办法实现下划线为虚线的。不过可以考虑使用border属性来实现。示例代码如下:

border-bottom:1px dashed #000

这里的意思就是1px宽度的黑色虚线下边框。看起来就跟下划线一样的效果。