CSS盒模型本質(zhì)上是一個(gè)盒子，封裝周圍的HTML元素，它包括邊距，邊框，填充，和實(shí)際內(nèi)容盒模型允許我們?cè)谄渌睾椭車剡吙蛑g的空間放置元素下面的圖片說明了盒子模型Box Model不同部分的說明Margin外邊距 清除邊框外的區(qū)域，外邊距是透明的Border邊框 圍繞在內(nèi)邊距和內(nèi)容外。

在CSS中，border是用于定義元素邊框樣式的屬性通過設(shè)置border屬性，你可以為元素添加邊框，并指定邊框的寬度樣式和顏色border屬性的語法如下border width style color下面是對(duì)上述語法中各個(gè)屬性的解釋width指定邊框的寬度可以使用像素px百分比%或其他長(zhǎng)度單位來指定style指定邊框。

bordercolor redborderstyle solid 注意，上述的三個(gè)屬性borderwidthbordercolorborderstyle，可以一起合并到一個(gè)屬性中，即quotborderquot所以，上述的代碼也可以簡(jiǎn)寫為css example border 2px solid red 上述的所有樣式都是可以在一個(gè)元素的所有四邊上下左右上。

1新建一個(gè)html文件，創(chuàng)建一個(gè)類名為wrap的div2先通過css類選擇器選擇到div來控制div的寬度和高度和背景顏色沒有邊框時(shí)方便看出來div的大小3通過div 的border屬性控制邊框顏色，設(shè)置border的寬度為2px，線型為實(shí)線，顏色為藍(lán)色4這樣就可以設(shè)置div邊框顏色寬度和高度，如下圖。

語法border borderwidth borderstyle bordercolor borderwidth 邊框?qū)挾瓤梢灾付ㄩL(zhǎng)度值如1px，1em單位為px，pt，em等或者使用關(guān)鍵字medium默認(rèn)，thick，thin #8195bordertopwidth設(shè)置元素上邊框?qū)挾? #8195borderrightwidth設(shè)置元素右邊框。

這是 css 設(shè)置圓角的，不過只在標(biāo)準(zhǔn)瀏覽器如火狐谷歌支持而已后面的數(shù)字是設(shè)置圓角的大小水平半徑垂直半徑。

下面就一個(gè)簡(jiǎn)單的盒子為例如圖 border這個(gè)位置可選border四邊邊框，bordertop頂部邊框，類似還有borderleftrightbutton寬度即為邊框?qū)挾葮邮接腥鐖D顏色忽略，如有不清楚的可以參見w3school教程asp 望采納。

HTML語句中“border=1”是邊框?yàn)?像素的意思border 是 CSS 的一個(gè)屬性，用 border 可以給能確定范圍的 HTML 標(biāo)記如 TDDIV 等等畫邊框，它可以定義邊框線的類型寬度和顏色，利用這個(gè)特性，可以制作一些特殊效果一borderwidththin medium thick 10px上邊框是細(xì)邊框，右邊框是中等邊框。

五CSS優(yōu)化把CSS樣式寫在網(wǎng)頁的head頭部標(biāo)簽里面，如果頁面體積大的時(shí)候，可以把CSS寫在文件里采取調(diào)用的方式六CSS代碼縮寫在CSS里面有不少可以縮寫的屬性，包括margin，padding，border，font，background和顏色值等七代碼壓縮當(dāng)你決定把網(wǎng)站項(xiàng)目部署到網(wǎng)絡(luò)上，那你就要考慮對(duì)CSS進(jìn)行壓縮。

3 代碼縮寫CSS代碼縮寫可以提高你寫代碼的速度，精簡(jiǎn)你的代碼量在CSS里面有不少可以縮寫的屬性，包括margin，padding，border，font，background和顏色值等，如果您學(xué)會(huì)了代碼縮寫，原本這樣的代碼lifontfamilyArial， Helvetica， sansseriffontsize 12emlineheight 14empaddingtop5pxpaddingbottom。

1border 設(shè)置元素主要的邊框?qū)傩?，包括borderwidthborderstylebordercolor，可缺省，無固定順序egcss view plaincopy border red 10px solidborder 5px blueborderstyle 統(tǒng)一設(shè)置元素各邊框的格式，按照CSS順序規(guī)則可取的值如下表所示CSS順序規(guī)則當(dāng)值有4個(gè)時(shí)，依次按照上右。

div的邊框?yàn)橐幌袼貙?shí)心的黑色邊框css代碼是bordercolor根據(jù)查詢相關(guān)公開信息顯示，該代碼的作用是針對(duì)邊框進(jìn)行顏色更改的，黑色將數(shù)據(jù)改為000，000，000即可。

十多重CSS樣式定義，屬性追加重復(fù)最后優(yōu)先原則一個(gè)標(biāo)簽可以同時(shí)定義多個(gè)class，也可以是同一個(gè)class中重復(fù)定義屬性例如我們先定義兩個(gè)樣式onewidth200pxbackgroundurl1jpg norepeat left toptwoborder10px solid #000 backgroundurl2jpg norepeat left top在頁面代碼中，我們可以。

設(shè)置表格邊框 要設(shè)置表格邊框，我們可以使用CSS的border屬性border屬性有三個(gè)值borderwidthborderstyle和bordercolorborderwidth用于設(shè)置邊框?qū)挾?，borderstyle用于設(shè)置邊框樣式，bordercolor用于設(shè)置邊框顏色例如，下面的CSS代碼將設(shè)置表格邊框?yàn)?像素寬的實(shí)線邊框，顏色為黑色```table border。

二邊框顏色樣式設(shè)置縮寫簡(jiǎn)化 TOP divcss5 borderstylesolid borderwidth1px bordercolor#000 這樣設(shè)置了“divcss5”對(duì)象邊框樣式，我們可以簡(jiǎn)寫 divcss5 bordersolid 1px #000 三個(gè)邊框值空格間隔開 縮寫邊框顏色樣式代碼可以為節(jié)約代碼，減少CSS代碼量。

一字體屬性 與字體有關(guān)的屬性包括fontfamily，fontstyle，fontvariant，fontweight，fontsize，font執(zhí)行順序是fontstyle，fontvariant，fontweight，fontsize 1fontfamily如果字體的名稱中含有空格，那么要加上雙引號(hào)2fontstylenormalitalicoblique 3fontvariantnormalsmall。