CSS　CSSでグラデーションを作る

css

CSS3　CSSでグラデーションを作る

css3

CSS3から、CSSだけでグラデーションを実現することができます。
以前は背景にグラデーションの画像を作ってrepeat-xなんてやっていたのが、やらなくてよくなります。
ただ、CSS3に対応したブラウザでしか見れませんけどね
上から下にグラデーションを作る方法です。

 background: -moz-linear-gradient(top, #ffffff, #999999);　/* Firefox用 */  
 background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#999999));　/* Safari,Google Chrome用 */  

Firefoxの場合、2番目の引数（#ffffff)がグラデーション開始地点の色、3番目の引数(#ffffff)が、グラデーション終了地点の色です。

Safari,Chromeの方は引数の最初から、線形（linear)、開始地点（left top）、終了地点（left bottom）、開始地点の色(#ffffff)、終了地点の色(#999999)です。