至少兩種顏色,多了不限
background-image: linear-gradient(顏色1,顏色2.....);
**如下
效果圖如下
background-image: linear-gradient(角度值,顏色1,顏色2.....);
效果圖如下
background-image: linear-gradient(to 方向,顏色1,顏色2.....);
注意:方向以to開頭
**如下·
效果圖如下
background-image: repeating-linear-gradient(顏色 百分比,顏色 百分比)
**如下
效果圖如下
background-image: linear-gradient(角度值,顏色1 百分比,顏色2 百分比.....);
**如下
效果圖如下
background-image: linear-gradient(to 方向,顏色1 百分比,顏色2 百分比...)
**如下
效果如下:
每種核心都寫一遍,那麼不同瀏覽器在執行**, 只會執行自己對應核心的**,其它**遮蔽
-moz- firefox
-webkit- chrome/safari -
-o- opera
-ms- ie
如果使用相容性的寫法,不加to 和background:
-moz-linear-gradient(top, #27b0f6 0%, #0aa1ed 100%);
background: -webkit-linear-gradient(top, #27b0f6 0%, #0aa1ed 100%);
background: -o-linear-gradient(top, #27b0f6 0%, #0aa1ed 100%);
background: -ms-linear-gradient(top, #27b0f6 0%, #0aa1ed 100%);
css線性漸變
css3中的線性漸變,有了這個,好多以前必須要用才能實現的效果如今可能只需簡單一行 就能實現。首先看看今天的主角 linear gradient 它,實際上不是顏色,而是背景。也就是說,它並不是color的屬性值,而是background的屬性值。我們接下來看看linear gradient 的具體...
CSS3 11 漸變 線性漸變 徑向漸變
漸變是css3當中比較豐富多彩的乙個特性,通過漸變我們可以實現許多炫麗的效果,有效的減少的使用數量,並且具有很強的適應性和可擴充套件性。可分為線性漸變 徑向漸變1.linear gradient線性漸變指沿著某條直線朝乙個方向產生漸變效果 a 語法 linear gradient b 引數說明 第乙...
css3線性漸變
css3漸變有兩種 linear gradient線性漸變和radial gradient徑向漸變。今天看的是linear gradient線性漸變,所以只做線性漸變的總結。w3c標準語法 formal grammar linear gradient to left right top bottom...