css虚线样式(如何制作CSS虚线样式)

一、CSS如何定义一条水平虚线

1、首先打开html编辑器软件，新建一个html文件，这里需要借助div来实现虚线的效果。首先在body内设置一个div，将div的id设置为xuxian：

2、在上方的style标签中，就可以把div的边框设置为虚线了，当然div的高度要设置成0，然后把将该边框的高度设置为0，将上边框或者下边框其中一个设置为一个像素的虚线：

3、来到浏览器，可以看到页面中出现了一条水平的虚线。以上就是用css设置水平虚线的方法：

二、div-css盒子怎么在里面添加虚线

已知的方式有2种（纯样式）：

1.用标签（div、span这些标签都可以）的边框线设置虚线来实现，比如在需要的位置插入div然后设置border-top(或者border-bottom):1px dashed#e5e5e5;(3个属性分别表示：1像素的边宽虚线颜色)；

2.用hr,不过因为实现方式和方式一一样，比如：<hr style="height:1px;border:none;border-top:1px dashed#e5e5e5;"/>，但是这个标签在H5种已经被淘汰了，完全可以靠第一种来实现。第二种就当做是知识扩展

三、css里border的虚线怎么设置

1、打开html开发工具，新建一个html代码页面，然后创建一个<div>标签，并给这个标签添加文字和一个class为了dashed。创建<div>代码:<div class="dashed">dashed:定义一个虚线边框</div>

2、设置虚线边框。创建<style>标签，然后在这个标签里设置dashed类的样式为虚线边框。css样式代码：<style type="text/css">.dashed{border-style:dashed;border-width:1px;</style>

3、保存html代码，然后使用浏览器打开，即可看到浏览器页面上显示一个虚线边框。