本節導圖
概念：把html頁面中的元素看作是乙個矩形的盒子也就是乙個呈裝內容的容器。
組成：由元素的內容，外邊距，邊框和內邊距組成。
1.邊框屬性：
<1>設定邊框樣式：
<2>設定邊框寬度
單位常用px
border-top-width：上邊框寬度
border-right-width：右邊框寬度
border-bottom-width：下邊框寬度
border-left-width：左邊框寬度
border-width：上邊框寬度[右邊框寬度 下邊框寬度 左邊框寬度 ]
<3>設定邊框顏色：
！！！注意：設定邊框顏色時必須設定邊框樣式，如果未設定樣式或設定為none，則其他邊框屬性無效。
<4>綜合設定邊框
2.內邊距屬性
padding-top：上內邊距
padding-right：右內邊距
padding-bottom：下內邊距
padding-left：左內邊距
padding：上內邊距[右內邊距 下內邊距 左內邊距]。
注：上邊設定中，padding相關屬性的取值可為auto自動（預設值），不同單位的數值，相對于父元素寬度的百分比%，實際工作中最常用的是畫素值px，不允許使用負值。
3.外邊距屬性
4.背景屬性
<1>設定背景顏色
通過background-color屬性來控制。
<2>設定背景影象
通過background-image來實現
<3>設定背景影象平鋪
通過background-repeat來實現
**1.元素的型別
一般分為快標記和行內標記，也稱塊元素和行內元素。
塊元素：通常都會佔據一整行或多整行，常用於網頁布局和網頁結構的搭建。常見的塊元素有~,,
,,行內元素：
特點為：不必在新的一行開始，同時，也不必強迫其它的元素在新的一行顯示。
2.元素的轉換：
使用display屬性轉換
inline;此元素將顯示為行內元素
block：此元素將顯示為塊元素
inline-block;此元素將顯示為行內塊元素，可以對其設定寬高和對齊等屬性，但是該元素不會獨佔一行。
none：此元素將被隱藏，不顯示，也不占用頁面空間
盒子模型與怪異盒子模型
所有html元素可以看作盒子，在css中，box model 這一術語是用來設計和布局時使用。css盒模型本質上是乙個盒子，封裝周圍的html元素，它包括 邊距，邊框，填充，和實際內容。盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素。下面的說明了盒子模型 box model content...
css盒子模型 CSS 盒子模型
css 盒子模型基本上是面試的必考題，因為實在是太重要了。以前寫 css 總是感覺元素的寬高十分難調，其中乙個很大的問題就是忽略了盒子模型的重要性。說到 css 盒子模型，你可能會說我知道呀，就是 margin 包 border,border 包 padding,padding 包 content ...
html盒子模型 jquery盒子模型
最近學了jquery的盒子模型之後，感覺真的顛覆我之前對盒子模型的看法，我在最初以為盒子模型只存在於html,我們就來看看他們有何區別。1.html盒子模型 如果說js裡面萬物皆是物件，那麼html裡面的萬物皆是盒子。不是盒子的我們也可以用dispiay block 變成盒子。那他的盒子是怎麼計算的...