一、css選擇器
1.優先順序：id>class>div(元件)
2.對所有元素賦值：*{color:red}
二、CSS優先順序
style屬性>id選擇器>class>tag
三、盒子模型
標籤元素排列規則是從左往右，從上往下排列


藍色部分：內部大小（真正可以寫字的部分）
padding:內邊距
border:邊框
mrgin:外邊距
盒子模型的排列：左右排列會都隔出來外邊距，上下排列會將重複的重疊
四、盒子樣式
同一個標籤下，同樣的樣式越下面優先順序越高
border樣式（邊框）
border:1px solid #red
border-left:1px solid #red
border-right:1px solid #red
border-top:1px solid #red
border-bottom:1px solid #red
margin樣式（外邊距）
margin:上 右 下 左（順時針，從上開始，一般使用畫素做單位）
margin-top:10px
margin-right:10px
margin-bottom:10px
margin-left:10px
margin:100px------上下左右全是100px
margin:100px auto------兩個的是第一個是上下，第二個是左右
padding樣式（內邊距）
padding:上 右 下 左（順時針，從上開始，一般使用畫素做單位）
padding-top:10px
padding-right:10px
padding-bottom:10px
padding-left:10px
五、文字樣式
font:字型  顏色 大小 粗細 對齊 裝飾
font-family:"微軟雅黑"（引號可以省略）
font-size:12px
font-weight:bold
text-align:left/center/right
line-height:數值（一般用畫素）
text-decoration:none/underline/overline/line-through
六、背景樣式
background:背景色
background-color:#fff
background-image:url('1.jpg')背景圖片
background-repeat:no-repeat---不允許重複（橫向重複repeat-x，縱向重複repeat-y）
background-position:top left（第一個是Y軸，第二個是X軸）
background-position:100px 100px
background-size:300px 300px(cover\contain)
七、圖片樣式
vertical-align:top/middle/bottom
注意：此處的對齊方式並非圖片相對於父元素的對齊，而是其他元素相對於圖片的對齊方式
八、佈局樣式
文件流：
浮動：style="background-color: seagreen;float: left;"
停止浮動：style="clear: both;"
float:left
人名幣符號：¥999就是￥
滑鼠在上面的時候顯示的顏色：li:hover
 
{color:red}
滑鼠在文字上變手指：cursor:pointer

定位：
position:absolute/fixed/relative/static/sticky(h5)
position需要與top/bottom/left/right連用
絕對定位absolute是以瀏覽器作為參考系，但是如果絕對定位的元素在非靜態定位(static)的                     
元素中，即為那麼就以這個元素為參考
fixed一般用在彈窗頁面固定，網頁廣告和輸入賬號密碼的情況
position：sticky;設定一個top=10px的話往下拉就是離頂部10畫素的位置就不動了

盒子層次：
z-index屬性，數值越高，越在頂層

呈現形式：
display::none/block/inline/inline-block
inline:無法設定寬高
inline-block:不會獨佔一行，也可以設定寬高（跟float很像）
block:塊級標籤，可設定寬高、元素獨佔一行

表格線框：
border-collapse:separate（有空隙）/collapse（去掉空隙）
border-spacing:10px 20px （水平和垂直的間隙）