模拟 IE 渐变中的颜色停止点

发布于 2024-10-15 05:06:06 字数 111 浏览 3 评论 0原文

我想给一个div一个带有多个色标的渐变,IE的filter属性不支持。有人有一个创造性的解决方法来模拟 IE 中的颜色停止吗? 我已经考虑过创建多个彼此相邻的 div...还有什么吗?

谢谢!

I want to give a div a gradient with multiple color-stops, which IE's filter property does not support. Anyone have a creative workaround to simulate the color stops in IE?
I already thought of creating multiple divs right next to each other... anything else?

Thanks!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

如何视而不见 2024-10-22 05:06:06

具有协调渐变颜色的多个 div 是创建 3+ 颜色渐变的最佳方式(不使用图像)。请参阅下面的小提琴进行工作测试:

http://jsfiddle.net/Hauhx/

Multiple divs with coordinated gradient colors is the best way (short of using images) to create 3+ color gradients. See fiddle below for a working test:

http://jsfiddle.net/Hauhx/

初见你 2024-10-22 05:06:06

我建议您使用背景图像作为不支持 CSS 渐变的浏览器(如 Opera 和 IE)的后备。

I'd recommend you to use a background image as a fallback for browsers (as Opera and IE) that don't support CSS gradients.

你与昨日 2024-10-22 05:06:06

或者使用 CSS3 PIE。很容易。

来自 设置线性渐变的开始和结束位置在 MSIE 9 及更早版本中

div {
    background-image: -moz-linear-gradient(360deg,rgb(255,255,255) 25% ,rgb(241,123,25) 75%);

    -pie-background: linear-gradient(360deg,rgb(255,255,255) 25% ,rgb(241,123,25) 75%);
behavior: url(/PIE.htc);
}

更新:如果 div 有上边距,那么它似乎会取消它。至少就我而言。不知道是不是两件事的结合。

Or use CSS3 PIE. Way easy.

From Setting linear gradient's starting and ending position in MSIE 9 and older

div {
    background-image: -moz-linear-gradient(360deg,rgb(255,255,255) 25% ,rgb(241,123,25) 75%);

    -pie-background: linear-gradient(360deg,rgb(255,255,255) 25% ,rgb(241,123,25) 75%);
behavior: url(/PIE.htc);
}

Update: if the div has a top margin then it seems to do away with it. At least in my case. Don't know if it's a combination of two things.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文