是否有可能使圖像在漸變中透明？

我想用CSS做。我不希望整個圖像在每個像素上都具有相同的透明度。是否有可能使圖像在漸變中透明？

來源

2012-08-11 scythargon

通過什麼方法？最簡單的答案是您只需創建一個24位PNG，並在其中創建任何透明度。如果你問的是通過CSS來做這個*，那是一個完全不同的問題。 – 2012-08-13 03:12:33

我的意思是CSS，我得到的答案低於 – scythargon 2012-08-14 10:19:17

您可以使用CSS3 Mask屬性。一篇很好的文章：http://css-tricks.com/webkit-image-wipes/

來源

2012-08-11 15:08:48 Roman

哇，這可能會有所幫助，我會盡快檢查，謝謝！ – scythargon 2012-08-11 19:14:09

你是可靠的，這裏是：'' – scythargon 2012-08-11 19:44:31

它可以完成！

/* 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/

來源

2012-08-11 15:04:36 ionFish

老兄，你沒有得到這個問題:) – scythargon 2012-08-11 19:45:08

@scythargon - 據我所知，你希望在圖像的一邊有完全不透明，然後讓它「漸變」到透明。 – ionFish 2012-08-11 20:06:26

是否有可能使圖像在漸變中透明？

回答

相關問題