邊框樣式

邊框樣式采用border-style來設(shè)置，可以簡寫為border

常用樣式

• none: 默認(rèn)無邊框
• dotted: 定義一個(gè)點(diǎn)線邊框
• dashed: 定義一個(gè)虛線邊框
• solid: 定義實(shí)線邊框
• double: 定義兩個(gè)邊框。 兩個(gè)邊框的寬度和 border-width 的值相同
• groove: 定義3D溝槽邊框。效果取決于邊框的顏色值
• ridge: 定義3D脊邊框。效果取決于邊框的顏色值
• inset:定義一個(gè)3D的嵌入邊框。效果取決于邊框的顏色值
• outset: 定義一個(gè)3D突出邊框。 效果取決于邊框的顏色值

附加

border也可以針對(duì)某個(gè)部分進(jìn)行添加邊框

例如：border-top是針對(duì)于頂部添加邊框

完整案例：

需求：為一個(gè)盒子創(chuàng)建一個(gè)頂部的白色實(shí)線邊框

完整代碼為

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

上面創(chuàng)建了一個(gè)盒子，class屬性為box。首先寫入邊框border后面跟著的1px為1像素的邊框 后面的solid為實(shí)線，white為邊框的顏色