CSS盒模型本質(zhì)上是一個盒子，封裝周圍的HTML元素，它包括邊距，邊框，填充，和實際內(nèi)容盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素下面的圖片說明了盒子模型Box Model不同部分的說明Margin外邊距 清除邊框外的區(qū)域，外邊距是透明的Border邊框 圍繞在內(nèi)邊距和內(nèi)容外。

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

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

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

語法border borderwidth borderstyle bordercolor borderwidth 邊框?qū)挾瓤梢灾付ㄩL度值如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è)置圓角的大小水平半徑垂直半徑。

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

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

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

3 代碼縮寫CSS代碼縮寫可以提高你寫代碼的速度，精簡你的代碼量在CSS里面有不少可以縮寫的屬性，包括margin，padding，border，font，background和顏色值等，如果您學(xué)會了代碼縮寫，原本這樣的代碼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個時，依次按照上右。

div的邊框為一像素實心的黑色邊框css代碼是bordercolor根據(jù)查詢相關(guān)公開信息顯示，該代碼的作用是針對邊框進(jìn)行顏色更改的，黑色將數(shù)據(jù)改為000，000，000即可。

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

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

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

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