css - グラデーションで画像を透明にすることはできますか？

Question

CSSを使ってやりたいです。画像全体がすべてのピクセルで同じ透明度になるようにしたくありません。

Answer 1

CSS3Maskプロパティを使用できます。それについての素晴らしい記事：http：//css-tricks.com/webkit-image-wipes/

Answer 2

できます！

/* using the mozilla kit */
background-image: -moz-linear-gradient(
  rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 95%
);

/* using webkit */
background-image: -webkit-gradient(
  linear, left top, left bottom, from(rgba(50,50,50,0.8)),
  to(rgba(80,80,80,0.2)), color-stop(.5,#333333)
);

これらはすべてのブラウザで機能するはずです：http：//www.leon-zinger.com/css-tricks/css3-gradients-with-opacity-works-with-ieおよびhttp://lea.verou.me/2009/02 / bulletproof-cross-browser-rgba-backgrounds /