1.1基本選擇器
標籤名選擇器
類名選擇器
id選擇器
全域性選擇器 *
1.2組合選擇器
① 後代選擇器
selector1 selector2
② 子元素選擇器
selector1>selector2
③ 並集選擇器
selector1,selector2
④ 交集選擇器
selector1selector2
1.3偽類選擇器
:link 超連結未訪問的狀態
:visited 超連結已訪問的狀態
:hover 滑鼠懸停在元素上
:active 滑鼠在元素上，按鍵按下去
**2.1display屬性**
值：inline
inline-block
block
none (隱藏)
**2.2 visibility 屬性**
值：visible 顯示
hidden
**2.3盒子模型的組成**
內容，內邊距，邊框，外邊距。
內容大小、內邊距的大小、邊框的寬度
外邊距並不是盒子的一部分，所以外邊距不影響元素的大小，影響元素的位置
2.4 盒子模型的內容區域
① 設定內容區域的寬高的 css 屬性
width
max-width
min-width
height
max-height
min-height
overflow： 值：
visible（預設，顯示）
hidden（隱藏）
auto（如果內容溢位加滾動條）
scroll（加滾動條，不論內容是否溢位）
overflow-x 設定水平方向溢位內容的顯示方式，值同 overflow 一樣
overflow-y 設定垂直方向溢位內容的顯示方式，值同 overflow 一樣
注意：2.5盒子模型的內邊距使用
overflow-x或overflow-y設定乙個方向上的溢位內容顯示方式，另一方向自動加滾動條。
padding-left 左內邊距
padding-right 右內邊距
padding-top 上內邊距
padding-bottom 下內邊距
padding 復合屬性，同時設定四個方向的內邊距
padding
乙個值： 設定4個方向的內邊距一樣padding
二個值： 第乙個值是上下內邊距，第二個值是左右內邊距padding
三個值： 第乙個值是上內邊距，第二個值是左右內邊距，第三個值是下內邊距padding
四個值： 四個值依次是 上內邊距、又內邊距、下內邊距、左內邊距
1，padding的預設值是0，不能設定為負
2，行內元素設定上下邊距，無法使盒子的占地位置變大，不建議設定。
2.6 盒子模型的邊框
① 邊框相關的 css 屬性
border 同時設定四個方向的邊框 復合屬性
border-style 設定邊框線風格 值: none、solid(實線)、dashed（虛線）、dotted(點線)、double(雙實線)
border-width 邊框寬度
border-color 邊框顏色
border-left 設定左邊框
border-left-style
border-left-width
border-left-color
border-right
border-right-style
border-right-width
border-right-color
border-top
...border-bottom
....
1，背景顏色會在邊框下面，一般邊框設定為實線看不到，如果邊框設定為虛線能看到邊框下面的顏色。
2，背景從內邊距區域開始顯示，不會在邊框上顯示。
2.7外邊距
① 設定外邊距
margin-left
margin-right
margin-top
margin-bottom
margin 復合屬性
1個值 四個方向的外邊距一起設定
2個值 第乙個值：上下外邊距 第二個值：左右外邊距
3個值 第乙個值：上外邊距 第二個值：左右外邊距 第三個值：下外邊距
4個值 依次是 上 右 下 左
設定右外邊距或者下外邊距影響的是後面元素的位置
子元素的前面或左邊如果沒有兄弟元素，左或上外邊距就是與父元素內容邊界距離
② 行內元素設定外邊距
行內元素只允許設定左右的外邊距，設定上下失效。
③ margin 特殊的值
margin 可以設定為 負值：
margin-left 為負值，元素向左位移
margin-top 為負值，元素會向上位移
margin-right 設定為負值，右邊的元素會覆蓋到當前元素上
margin-bottom 設定為負值，下邊的元素會覆蓋到當前元素上
塊級元素的左右外邊距設定為auto，元素會在父元素中水平居中。
上下外邊距無法設定auto。
④ margin 塌陷
什麼情況下發生margin塌陷？
給某個父元素的第乙個子元素設定上外邊距，上外邊距會作用在父元素上，該現象稱之為 margin 塌陷
或者給父元素的最後乙個子元素設定下外邊距，子元素的下外邊距會作用在父元素上，也是 margin 塌陷
如何解決 margin 塌陷？
方案一： 給父元素新增邊框
方案二： 給父元素設定 css 屬性 overflow:hidden (把父元素設定為 bfc)
⑤ margin 合併
兩個兄弟元素垂直排列
前面的兄弟元素如果設定了下外邊距，後面兄弟元素設定了上外邊距
兩個元素之間的距離取 上面元素下外邊距和下面元素上外邊距中大的乙個
① 可以繼承的 css 屬性
字型屬性（font系列），文字屬性（文字對齊，行高），字型顏色
② 不可以繼承的 css 屬性
寬高設定，內外邊距，邊框，背景。
注意：
給 a 的父元素設定字型顏色和text-decoration 的時候，a 不會生效
原因：a 有預設的 color 和 text-decoratoin 的設定，預設的樣式設定權重比繼承的樣式大
直接對元素的樣式設定 > 預設的樣式設定 > 繼承下來的樣式設定
4.1 文字屬性會對行內元素和行內塊元素起作用
行內元素和行內塊元素可以被當做文字進行處理，如果在父元素那裡設定文字屬性，會對行內元素和行內塊元素起作用
如何讓乙個行內塊元素或行內元素水平居中對齊？
給它的父元素設定 text-align:center;
如何讓乙個行內塊元素在父元素中垂直居中？
給父元素設定行高（行高=高度）
給行內塊元素設定 vertical-align: middle
如何讓乙個塊級元素在父元素中水平居中對齊？
給元素自己設定左右外邊距為 auto
行內元素或行內塊元素之間會出現空白，空白其實是**中的換行符。
解決方案：
方案一：寫**的時候不換行，也沒有空格
方案二：設定父元素字型大小為 0，子元素再單獨設定字型大小
設定溢位屬性和可見性屬性
overflow 指明在元素內容超出元素邊界時，超出部分是被截掉，還是用滾動條顯示。可選的值是 visible 顯示超出該元素的內容 hidden 隱藏 scroll 總是顯示滾動條 auto 讓瀏覽器決定是否顯示滾動條 或者inherit 使用父物件的設定 clip 指定專案的裁剪框，只顯示框內的...
CSS控制元素的顯示型別和可見性
造成這種情況的本質是它們的display屬性，即塊級元素被設定為display block 對於li元素為display list item 而行內元素被設定為display inline。display可設定的值 值描述 none 此元素不會被顯示。block 此元素將顯示為塊級元素，此元素前後會...
盒子模型和css屬性
2.對於盒子模型來說，通常是由 內容模組 內邊距 邊框 外邊距四部分組成，對應現實生活中的蛋糕盒，我們可以發現 蛋糕盒裡面的蛋糕就相當於內容模組，蛋糕和包裝盒之間的距離我們可以認為是內邊距，包裝盒那層薄薄的紙可以認為是邊框，蛋糕盒和其他蛋糕盒的距離可以認為是外邊距。css盒子模型 3.所以對於盒子模...