1.background-img漸變
1.1線性漸變
background-image:linear-gradient(這種漸變在一條直線上從乙個顏色過渡到另乙個顏色)。
取值：在關鍵字 to 後面加上 top、bottom、right、left 中的某乙個關鍵字或多個關鍵字，例如 to bottom left
例如：
body
如果漸變是從元素上邊的紫色過度到下邊的綠色，要使用 to bottom 關鍵字
body
還可以用 to bottom right 這樣的關鍵字指定漸變的角度。使漸變從元素的左上角開始，到元素的右下角結束。
body
角度值的寫法：
在0~360之間的數字後面加上deg，指定過渡在哪個方向結束。
background-image: linear-gradient(to top, #7a88ff, #7affaf);
等價於：
background-image:linear-gradient(0deg, #7a88ff, #7affaf);
background-image: linear-gradient(to top, #7a88ff, #7affaf)等價於background-image:linear-gradient(0deg, #7a88ff, #7affaf);
關於角度取值如下：
角度的值按順時針方向旋轉，因此，90deg 表示元素的右邊（與 to right 相同），180deg 表示元素的底邊（與 to bottom 相同），270deg 表示元素的左邊（與 to left 相同）。
使用多色漸變時，第乙個顏色和最後乙個顏色無需指定位置，因為瀏覽器會預設第乙個顏色從0%的位置開始，最後乙個顏色在100%的位置結束。
1.2 平鋪線性漸變
background-image:repeating-linear-gradient()
平鋪的線性漸變其實就是在普通的漸變基礎上多了乙個重複的效果。
1.3 徑向漸變就是沿著圓周或者橢圓周向外擴散的漸變。
background-image:radial-gradient()
圓形漸變
body
設定徑向漸變的中心點
可以用關鍵字 at 後面加上 background-position 屬性支援的定位關鍵字和數值，指定漸變中心的位置
closest-side：告訴瀏覽器從中心點向外擴充套件漸變，到離中心點最近的一邊結束。
closest-corner：以離漸變中心點最近的元素頂角計算漸變的範圍。
farthest-side：以離漸變中心點最遠的那一邊計算圓的半徑。
farthest-corner：以離漸變中心點最遠的頂角計算圓的半徑。
1.4平鋪的徑向漸變
跟平鋪的線性漸變原理相同
例如：
body注：為了讓平鋪的徑向漸變看起來比較流暢，結束顏色應該與起始顏色相同。這樣能讓顏色自然地回歸最初的顏色。再注：因為web瀏覽器會把線性漸變和徑向漸變當成背景圖，所以可以使用控制背景圖的其他屬性，比如background-size、background-position等
html css雜碎知識點
1.charset 編碼字符集 utf 8 任何國家語言 gb2312 中國 簡體字符集 gbk 包括所有亞洲字符集和繁體字符集 unicode 萬國碼 2.告訴搜尋引擎爬蟲我們的 是什麼內容 3.佔位符 提示符 4.標籤 超連結，錨點，協議限定符 雙擊回頂部 置頂 find demol5.兩頁面操...
Html Css 小知識點
選擇器 根據選擇器來對html內的內容做css修飾 樣式 找到乙個元素 找到乙個元素 選擇器 css都在style標籤內部寫 1.標籤選擇器 根據標籤名查詢。小麗 2.id選擇器 id必須是唯一的。css修飾是用 開頭 3.class選擇器，可以選擇多個元素，加到多個標籤裡面，css修飾.開頭 優先...
HTML CSS注意知識點
1.meta標籤 資料以鍵值對的形式存在。可以提供搜尋引擎的關鍵字 可以重定向和確定文的形式。如下 3.不是所的css樣式都可以繼承。例如border是不可以繼承的。color可以繼承！4.select check radio的value屬性值是不能顯示在網頁中的 但是button的卻可以 css盒...