1、【CSS進階】CSS 顏色體系詳解

　　知識點梳理：

　　　　a、顏色關鍵字錯誤時，該條CSS屬性將無效，而不是使用currentColor替代

　　　　b、CSS3之前，transparent只能用于border-color、background-color，CSS3中transparent則作為一個顏色值使用

　　　　c、transparent的妙用：1、繪制三角形；2、增大可點擊區域

　　　　d、rgb與hsl的定義及轉換

?2、CSS常見居中討論

　　　知識點梳理：

　　　　a、左右居中常用text-align和margin: 0 auto

　　　　b、上下居中常用：

　　　　　　　　1、借助table-cell；

　　　　　　　　2、top: 50%和margin-top/translate(0, -50%)結合，左右居中也可以使用該方法

　　　　c、position: absolute和margin: auto結合，達到上下左右居中

　　　　d、b1與c兼容ie8+、chrome，但ie7不行

3、判斷鼠標移入移出元素時的方向

　　　知識點梳理：

　　　　a、CSS3屬性：transition的靈活使用

　　　　b、調用DOM元素的offsetWidth屬性，會立即觸發頁面重繪（正常情況下，在js線程閑置時頁面才會重繪）

　　　　c、注意mouseenter、mouseleave與mouseover、mouseout的不同

　　　　d、通過方法getBoundingClientRect()可以獲取當前元素的坐標區域，通過斜率判斷移動的方向

4、【CSS進階】偽元素的妙用--單標簽之美

　　　知識點梳理：

　　　　a、偽元素::before、::after可以使一個標簽當三個標簽使用，可以消除多余元素，極大增強html的語義性

　　　　b、ie7及以下不支持befor等偽元素，ie8+、chrome均支持

　　　　c、使用after偽類可以清理浮動，詳細介紹：用after偽類清除浮動

　　　　　　　　.container:after{content:''; display:block; clear:both} .container{*zoom:1} ? ? ?此樣式更為簡潔

　　　　d、ie7及以下兼容（*），而ie8+、chrome不兼容，c 中即可以使用該hack

　　　　e、使用偽元素可以解決css sprites圖標間距的問題

?5、文件各種上傳，離不開的表單

　　待實踐，注意文章后面的引用，另外，一篇關于文件下載的文章：文件下載之斷點續傳（客戶端與服務端的實現）

?

轉載于:https://www.cnblogs.com/MattCheng/p/5707227.html

總結

以上是生活随笔為你收集整理的精品文章收藏的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。