边框样式

边框样式采用border-style来设置，可以简写为border

常用样式

• none: 默认无边框
• dotted: 定义一个点线边框
• dashed: 定义一个虚线边框
• solid: 定义实线边框
• double: 定义两个边框。 两个边框的宽度和 border-width 的值相同
• groove: 定义3D沟槽边框。效果取决于边框的颜色值
• ridge: 定义3D脊边框。效果取决于边框的颜色值
• inset:定义一个3D的嵌入边框。效果取决于边框的颜色值
• outset: 定义一个3D突出边框。 效果取决于边框的颜色值

附加

border也可以针对某个部分进行添加边框

例如：border-top是针对于顶部添加边框

完整案例：

需求：为一个盒子创建一个顶部的白色实线边框

完整代码为

<style>
.box{
border:1px solid white;
}
</style>
<div class="box"></div>

上面创建了一个盒子，class属性为box。首先写入边框border后面跟着的1px为1像素的边框 后面的solid为实线，white为边框的颜色