IE対応。CSS3でグラデーションをかける方法
CSS3を使ってグラデーションを作るとき、IEの場合はIE独自のfilterを用います。
IE5.5以上で有効なので、ほぼもれなく対応できます。
filter: progid:DXImageTransform.Microsoft
.gradient(GradientType=0,startColorstr='#ffffffff', endColorstr='#ffdddddd');
GradientTypeが【引数】で、startColorstrは【開始の色】、endColorstrは【終了の色】です。
引数「GradientType」は、縦方向のグラデーションなら【0】、横方向のグラデなら【1】をいれます。
色の番号は通常の6ケタに、2ケタ加えた8ケタです。
最初の2桁は色の透明度の指示です。
00(透明)〜FF(不透明)。
【#FFFFFFFF】なら、【FF(不透明)】+【FFFFFF(白)】という意味になります。
Webkit系(Chrome、Safari)の
background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#DDDDDD));
や
mozilla系(Firefox)の
background: -moz-linear-gradient(top, #FFFFFF, #DDDDDD);
と一緒に使えば、既存のブラウザはほぼ対応できます。