background-image: linear-gradient( [ | ]?, [, ]+ );
意為：(角度deg或者方位詞,乙個或多個漸變顏色關鍵結點（多個的話用","隔開）);
此種寫法跟正規表示式類似：
[ ]：代表乙個字元位，一般跟 「|」 連用，表示從[ ]中選擇乙個；
|：表示「或」，意為從此符號左右兩邊選擇乙個。
eg：[1|2]，即表示此位不是1就是2；
？：表示可有可無，取值範圍為[0,1]；
*：表示可有可無，取值範圍為(0,+∞)；
+：表示至少有乙個，取值範圍為[1,+∞]；
此篇用chrome瀏覽器預覽，故加上-webkit-字首（以紅黃二色為例）
1）找到漸變圖形的中心點，以此為座標原點做座標系。
2）從0deg開始，逆時針旋轉形成的夾角角度為正，順時針旋轉形成的夾角角度為負。
3）漸變趨勢跟沿著旋轉一定角度後形成的射線方向相同。
xx=0 或 xx=360 時，漸變為水平從左向右；
eg:background: -webkit-linear-gradient(0deg,red 0,yellow 200px);
xx=90 時，漸變為垂直從下向上；
eg:background: -webkit-linear-gradient(90deg,red 0,yellow 200px);
xx=180 時，漸變為水平從右向左；
eg:background: -webkit-linear-gradient(180deg,red 0,yellow 200px);
xx=270 時，漸變為垂直從上向下；
eg:background: -webkit-linear-gradient(270deg,red 0,yellow 200px);
圖例一：
圖例二：
可選值有top（270deg或-90deg）、 bottom（90deg）、left （0deg）、right（180deg）、left top（315deg或-45deg）、left bottom（45deg）、right top（225deg或-135deg）、right bottom（135deg），用來表示 從上往下、從下往上、從左往右、從右往左、從左上往右下、從左下往右上、從右上往左下、從右下往左上等方位。
公式：[ | ]
意為：顏色值或代表顏色的英文單詞
+空格+此漸變關鍵點所在位置在相應圖形中所佔的百分比或長度值（px）;
注：此處乙個顏色值只能對應乙個位置[ | ]（百分比是位置在兩個顏色關鍵結點連線的百分比，長度值是位置和原點的距離）。
理解CSS3線性漸變
為了顯示乙個漸變而專門製作乙個的做法是不靈活的，而且很快會成為一種不好的做法。但是遺憾的是，截至寫這篇文章，可能還必須這樣做，但是希望不會持續太久。多虧firefox 和safari chrome，我們現在可以使用最少的努力實現強大的漸變。在本文中，我們將展示css漸變的簡單實現以及該屬性在mozi...
css3線性漸變
css3漸變有兩種 linear gradient線性漸變和radial gradient徑向漸變。今天看的是linear gradient線性漸變，所以只做線性漸變的總結。w3c標準語法 formal grammar linear gradient to left right top bottom...
css3線性漸變
css3線性漸變 為了建立乙個線性漸變，必須至少定義兩種顏色節點。顏色節點即你想要呈現平穩過渡的顏色。同時，你也可以設定乙個起點和乙個方向 或者乙個角度 語法 background image linear gradient direction,color1,color2 線性漸變 從上到下 預設情...