特殊的屬性
1、link和import的區別
兼容性（低/無） | 權重高/低 | 運行時間（頁面加載時/頁面加載後）
2、transition和animation的區別
Transition: property duration time-function delay；配合：hover等僞元素
Animation: name duration timing-function delay iteration-count direction; 配合@keysframs name使用
同：隨着時間改變屬性值
異：觸發條件（動作事件/自動）
3、relative和absolute的區別
參照對象不同（本身/最近的父級元素）
4、block和inline的區別
可支配的屬性不同（寬高內外邊距都可以/寬高不可以+上下內外邊距不可以）
block標籤：div、p、h1-h6、ul、ol、li、dl、dt
inline標籤：span、a、I、img、input、select、strong
5、:first-child :last-child :nth-child(n)
6、選擇器模塊
盒子 display:flex;
邊框和背景
2d和3d特效 transform：translate（x，y）rotate（deg）scale（x_num，y_num）skew（x_deg, y_deg）
Matrix:translate \ scale \ rotate \ skew
某種效果的實現
1、實現一個三角形
原理：邊框分佈
代碼：width/height = 0； border-top:6px solid red; border-right/bottom/left: 6px solid transparent;
2、塊居中顯示
條件：父級有指定寬高 margin：0 auto；
條件：父級高不確定子高確定 父級relative、子absolute + 寬高 + left:50%;top:50%;transform：transition（-w/2，-h/2）
條件：父級高子高都不確定 父display:flex; +align-items:center; justify-content:center;
3、清浮動
clear：both； overflow：hidden/auto；:after{clear: both;content: ‘’;}
4、彈性佈局
核心：display：flex；
