手册
目录
前言:
CSS 边框属性允许你指定元素边框的样式、宽度和颜色。
border-style 属性用于指定显示哪种类型的边框。
允许使用以下值:
dotted - 定义点状边框dashed - 定义虚线边框solid - 定义实线边框double - 定义双线边框groove - 定义3D凹槽边框。效果取决于 border-color 的值ridge - 定义3D凸脊边框。效果取决于 border-color 的值inset - 定义3D内嵌边框。效果取决于 border-color 的值outset - 定义3D外凸边框。效果取决于 border-color 的值none - 不设置边框hidden - 定义隐藏边框border-style 属性可以设置为一个到四个值(分别对应上边框、右边框、下边框和左边框)。
演示不同的边框样式:
p.dotted {border-style: dotted;}<br></br>p.dashed
{border-style: dashed;}<br></br>p.solid {border-style: solid;}<br></br>p.double
{border-style: double;}<br></br>p.groove {border-style: groove;}<br></br>p.ridge
{border-style: ridge;}<br></br>p.inset {border-style: inset;}<br></br>p.outset
{border-style: outset;}<br></br>p.none {border-style: none;}<br></br>p.hidden {border-style: hidden;}<br></br>
p.mix {border-style: dotted dashed solid double;}
运行实例 » 点击 "运行实例" 按钮查看在线实例
结果:
一个点状边框。
一个虚线边框。
一个实线边框。
一个双线边框。
一个凹槽边框。效果取决于 border-color 的值。
一个凸脊边框。效果取决于 border-color 的值。
一个内嵌边框。效果取决于 border-color 的值。
一个外凸边框。效果取决于 border-color 的值。
没有边框。
一个隐藏边框。
一个混合边框。
注意: 除非设置了 border-style 属性,否则其它所有 CSS 边框属性(你将在后续章节中学习)都不会起任何作用!
相关
视频
RELATED VIDEOS
科技资讯
1
2
3
4
5
6
7
8
9
精选课程
共5课时
17.3万人学习
共49课时
77.7万人学习
共29课时
62.2万人学习
共25课时
39.6万人学习
共43课时
71.5万人学习
共25课时
62.1万人学习
共22课时
23.2万人学习
共28课时
34.2万人学习
共89课时
126.3万人学习