CSS3 gradient rendering issues from transparent to white

前端 未结 3 1856
再見小時候
再見小時候 2020-12-09 01:00

I am having issues with cross browser rendering of CSS3 gradients. This is happening when I am trying to create a gradient from transparent colour to white.

The file

3条回答
  •  情歌与酒
    2020-12-09 01:28

    I've encountered this as well. I'm not sure why it happens, but here's what I've used in my own projects as a workaround:

    background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.001) 0%, #fff 5%, #fff 100%);
    

    Instead of giving Chrome a "transparent" value, give it something very, very close to transparent. Hope this helps!

    Edit: I forgot to post a link to my own version, which renders as expected in Chrome 21 (Windows 7).

提交回复
热议问题