css Chrome和Safari浏览器中的线性渐变

5cnsuln7 于 2023-06-25 发布在其他

关注(0)|答案(6)|浏览(174)

我在Safari和Chrome中显示线性渐变时遇到问题。在Firefox中，它显示得很好。
我正在努力：

background: -webkit-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;   
background:    -moz-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;
background:     -ms-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;
background:      -o-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;

谢谢你的帮助。

css

来源：https://stackoverflow.com/questions/11693580/linear-gradient-in-chrome-and-safari-browsers

6条答案

按热度按时间

ccrfmcuu1#

试试这个-http://jsfiddle.net/fwkgM/1/

background-color: #9e9e9e;
  background-image: linear-gradient(to bottom, #9e9e9e, #454545);

CSS3 Please

赞(0）回复(0）举报 2023-06-25

zc0qhyus2#

你也可以试试这个：
http://www.colorzilla.com/gradient-editor/
这是一个非常好的CSS3梯度生成器。它对我很有效。希望对你也有帮助！：D

赞(0）回复(0）举报 2023-06-25

k75qkfdt3#

为了跨浏览器兼容性，请尝试以下操作

background-color: #9e9e9e; /* fallback color if gradients are not supported */
background-image: -webkit-linear-gradient(bottom, rgb(213,12,18), #9e9e9e 40%); /* For Chrome 25 and Safari 6, iOS 6.1, Android 4.3 */
background-image:    -moz-linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* For Firefox (3.6 to 15) */
background-image:      -o-linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* For old Opera (11.1 to 12.0) */ 
background-image:         linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* Standard syntax; must be last */

赞(0）回复(0）举报 2023-06-25

vi4fp9gy4#

background: -webkit-linear-gradient(left,transparent,black 50%,transparent); /* worked for me*/

赞(0）回复(0）举报 2023-06-25

lkaoscv75#

background-attachment: fixed; /* worked for me */

赞(0）回复(0）举报 2023-06-25

q9yhzks06#

对我来说，safari不喜欢从一个颜色变成transparent，所以唯一的解决办法就是从一个透明的颜色变成一个零透明度版本的相同颜色。
坏了

background: linear-gradient(to bottom, rgba(255, 255, 255, .75), transparent);

很好

background: linear-gradient(to bottom, rgba(255, 255, 255, .75), rgba(255, 255, 255, 0));

赞(0）回复(0）举报 2023-06-25

我来回答

css Chrome和Safari浏览器中的线性渐变

6条答案

相关问题

热门标签

最新问答