css 有三個非常重要的三個特性：層疊性、繼承性、優先順序.
相同選擇器給設定相同的樣式，此時乙個樣式就會覆蓋（層疊）另乙個衝突的樣式.
層疊性原則:
子元素可以繼承父元素的樣式（text-，font-，line-這些元素開頭的可以繼承，以及color屬性）
繼承之a標籤特殊情況
補充知識：a標籤的字型顏色不能繼承
行高的繼承性：
body
/*行內樣式表 > id選擇器 > 類選擇器 > 標籤選擇器*/
/* 行內樣式是：1000
id選擇器：100
類選擇器：10
標籤選擇器：1
*/
權重是有4組數字組成,但是不會有進製。
可以理解為類選擇器永遠大於元素選擇器, id選擇器永遠大於類選擇器,以此類推…
等級判斷從左向右，如果某一位數值相同，則判斷下一位數值.
可以簡單記憶法: 萬用字元和繼承權重為0, 標籤選擇器為1,類(偽類)選擇器為 10, id選擇器 100, 行內樣式表為 1000, !important 無窮大.
繼承的權重是0， 如果該元素沒有直接選中，不管父元素權重多高，子元素得到的權重都是 0.
網頁三大核心：盒子模型 浮動 定位
盒子模型組成
css 盒子模型本質上是乙個盒子，封裝周圍的 html 元素，它包括：邊框、外邊距、內邊距、和實際內容
**1.**border可以設定元素的邊框。邊框有三部分組成：邊框寬度(粗細),邊框樣式,邊框顏色；
2.語法：
邊框樣式 border-style 可以設定如下值：
邊框簡寫:
border
: border-width || border-style || border-color;
top,right,bottom,left
border-top
: 1px solid red;
/* 只設定上邊框， 其餘同理 */
邊框影響盒子大小
邊框會額外增加盒子的實際大小。因此我們有兩種方案解決:
測量盒子大小的時候,不量邊框.
如果測量的時候包含了邊框,則需要 width/height 減去邊框寬度
內邊距的使用方式
padding簡寫屬性
padding影響盒子大小
網頁上顯示的盒子大小: 寬高 + 內邊距+邊框
如果盒子已經有了寬度和高度，此時再指定內邊框，會撐大盒子。
解決方案：
如果保證盒子跟效果圖大小保持一致，則讓 width/height 減去多出來的內邊距大小
如果盒子本身沒有指定width/height屬性, 則此時padding不會撐開盒子大小.
外邊距：盒子與盒子之間的距離
margin簡寫方式和padding一致
塊級盒子水平居中對齊
常見的寫法，以下三種都可以：
margin-left
: auto;
margin-right
: auto;
margin
: auto;
margin
: 0 auto (實際工作中使用比較多)
文字居中：text-align:center
盒子居中：margin: 0 auto
外邊距塌陷
解決方式：
① 可以為父元素定義上邊框。
② 可以為父元素定義上內邊距。
③ 可以為父元素新增 overflow:hidden
清除內外邊距
/* 以後寫css都要寫這句** 清除內外邊距 */
*span
列表預設樣式
去掉li前面的圓點
list-style
: none;
CSS三大特性與盒子模型
恢復內容開始 css三大特性 css層疊性 css繼承性 css優先順序 important都具有最大優先順序 行內 id 標籤 萬用字元 繼承 內容 寬高 內邊距 邊框 外邊距 border邊框 none 沒有邊框即忽略所有邊框的寬度 預設值 solid 邊框為單實線 最為常用的 dashed 邊...
css盒子模型 CSS 盒子模型
css 盒子模型基本上是面試的必考題，因為實在是太重要了。以前寫 css 總是感覺元素的寬高十分難調，其中乙個很大的問題就是忽略了盒子模型的重要性。說到 css 盒子模型，你可能會說我知道呀，就是 margin 包 border,border 包 padding,padding 包 content ...
CSS盒子筆記
css選擇器，大家寫css選擇器的時候，能共用的選擇器盡量提取出來 2，差距生成的呢？每天比別人落後一點，時間長了就跟不上了 這也是乙個態度的問題 總之，不要指望老師放慢速度，自己盡快適應 3，選擇器的繼承 和css樣式優先順序，有類似之處 關聯的選擇器 id選擇器 類選擇器 元素選擇器 越精確的優...