1.行內樣式 1000
2.id 0100
3.類選擇器、偽類選擇器、屬性選擇器[type=「text」] 0010
4.標籤選擇器、偽元素選擇器(::first-line) 0001
5.萬用字元*、子選擇器、相鄰選擇器 0000
1、顏色：新增rgba、hsla模式
2、文字陰影(text-shadow)
3、邊框：圓角（border-radius）邊框陰影：box-shadow
4、盒子模型：box-sizing
5、背景：background-size設定背景的尺寸，background-origin設定背景的原點，background-clip設定背景的裁剪區域，以「，」分隔可以設定多背景，用於自適應布局
6、漸變：linear-gradient、radial-gradient
7、過渡：transition可實現動畫
8、自定義動畫
9、在css3中唯一引入的偽元素是::selection
10、多**查詢、多欄布局
11、border-image
12、2d轉換：transform:translate(x,y)rotate(x,y)skew(x,y)scale(x,y)
13、3d轉換
static是預設值
relative相對定位 相對於自身原有位置進行偏移，仍處於標準文件流中
absolute絕對定位 相對於最近的已定位的祖先元素, 有已定位(指position不是static的元素)祖先元素, 以最近的祖先元素為參考標準。如果無已定位祖先元素, 以body元素為偏移參照基準, 完全脫離了標準文件流。
fixed固定定位的元素會相對於視窗來定位,這意味著即便頁面滾動，它還是會停留在相同的位置。乙個固定定位元素不會保留它原本在頁面應有的空隙。
部分渲染樹（或者整個渲染樹）需要重新分析並且節點尺寸需要重新計算。這被稱為重排。注意這裡至少會有一次重排-初始化頁面布局。 由於節點的幾何屬性發生改變或者由於樣式發生改變，例如改變元素背景色時，螢幕上的部分內容需要更新。這樣的更新被稱為重繪。
新增、刪除、更新 dom 節點 通過 display: none 隱藏乙個 dom 節點-觸發重排和重繪 通過 visibility: hidden 隱藏乙個 dom 節點-只觸發重繪，因為沒有幾何變化 移動或者給頁面中的 dom 節點新增動畫 新增乙個樣式表，調整樣式屬性 使用者行為，例如調整視窗大小，改變字型大小，或者滾動。
清除浮動： 核心：clear:both;
1.使用額外標籤法（不推薦使用）
在浮動的盒子下面再放乙個標籤，使用 clear:both;來清除浮動
a 內部標籤：會將父盒子的高度重新撐開
b 外部標籤：只能將浮動盒子的影響清除，但是不會撐開盒子
2.使用 overflow 清除浮動（不推薦使用）
先找到浮動盒子的父元素，給父元素新增乙個屬性：overflow:hidden;就會清除子元素對頁面的影響
3.使用偽元素清除浮動(用的最多)
偽元素：在頁面上不存在的元素，但是可以通過 css 新增上去
種類：:after(在。。。之後)
:before(在。。。之前)
注意：每個元素都有自己的偽元素
.clearfix:after .clearfix
塊級元素(block)特性：
總是獨佔一行，表現為另起一行開始，而且其後的元素也必須另起一行顯示;
寬度(width)、高度(height)、內邊距(padding)和外邊距(margin)都可控制;
內聯元素(inline)特性：
1和相鄰的內聯元素在同一行;
2寬度(width)、高度(height)、內邊距的 top/bottom(padding-top/padding-bottom)和外邊距的 top/bottom(margin-top/margin-bottom)都不可改變（也就是 padding 和 margin 的 left 和 right 是可以設定的），就是裡面文字或的大小。
那麼問題來了，瀏覽器還有預設的天生 inline-block 元素（擁有內在尺寸，可設定高寬，但不會自動換行），有哪些？
答案：、。
方法一：絕對定位居中（原始版之已知元素的高寬）
.content
.content
.content
body
}
.content
父元素中設定 font-size:0;letter-spaceing:-4px;
flex 主要用於一維布局，而 grid 則用於二維布局。
解析：flex
flex 容器中存在兩條軸， 橫軸和縱軸， 容器中的每個單元稱為 flex item。
在容器上可以設定 6 個屬性：
flex-direction
flex-wrap
flex-flow
justify-content
align-items
align-content
注意：當設定 flex 布局之後，子元素的 float、clear、vertical-align 的屬性將會失效。
flex 專案屬性
有六種屬性可運用在 item 專案上:
order
flex-basis
flex-grow
flex-shrink
flex
align-self
grid
css 網格布局用於將頁面分割成數個主要區域，或者用來定義元件內部元素間大小、位置和圖層之間的關係。
像**一樣，網格布局讓我們能夠按行或列來對齊元素。 但是，使用 css 網格可能還是比 css **更容易布局。 例如，網格容器的子元素可以自己定位，以便它們像 css 定位的元素一樣，真正的有重疊和層次。
前端知識梳理
保證內部一致性 使併發更新變得可行 react 可以根據 setstate 來自的不同的位置 事件控制代碼，網路響應，動畫等，來為它們分配不同的優先順序。鉤子函式 函式元件不能使用這些方法，因為這需要繼承react component這個類 getinitialstate componentwill...
前端知識重新梳理 1
先上定義 display block 塊級元素 1，每個塊級元素會獨佔一行 2，缺省會自動填滿父級寬度 3，塊級元素可以設定padding和margindisplay inline 內聯元素 1，內聯元素不會獨佔一行，多個相鄰的內聯元素會排列在同一行裡，直到一行排列不下，才會新換一行，其寬度隨元素的...
前端知識體系梳理
高頻考題 盒模型 動畫 css3 預處理器 sass less postcss.基礎其他題目 書籍推薦基礎 原型 繼承 事件流 事件委託 變數 作用域 閉包 this 上下文 事件迴圈 前端快取 正則 跨域 settimeout setinterval requestanimationframe 深...