Question

有可能从jquery获得这样的东西吗？

<div id="test" style="background: -webkit-linear-gradient(top, #2F2727, #1a82f7); 
background: -moz-linear-gradient(top, #2F2727, #1a82f7);"/>

当我使用时：

$("#test").css({
   'background': '-webkit-linear-gradient(top, #2F2727, #1a82f7)',
   'background': '-moz-linear-gradient(top, #2F2727, #1a82f7)'
});

结果是（在chrome中）

<div id="test" style="background: -webkit-linear-gradient(top, #2F2727, #1a82f7); "/>

Answer 1

这在jQuery中是不可能的，因为密钥不能重复。您必须使用$.cssHooks或：

$("#test").css('background', '-webkit-linear-gradient(top, #2F2727, #1a82f7)')
          .css('background', '-moz-linear-gradient(top, #2F2727, #1a82f7)');

我建议不要使用style设置固定样式，而是使用*Class函数：addClass，removeClass和toggleClass。

对于HTML，您必须使用style属性：

<div id="test" style="background: -webkit-linear-gradient(top, #2F2727, #1a82f7); 
 background: -moz-linear-gradient(top, #2F2727, #1a82f7);"/>

Answer 2

不，你不应该这样做。单个CSS属性不能有多个值。这直接在CSS中起作用，因为重复的属性会相互覆盖，在这种情况下依赖于浏览器。基本上，使用该CSS，基于webkit的浏览器会查看特定于webkit的属性并应用它，然后查看未知属性并忽略它。基于Gecko的浏览器将看到一个未知属性并忽略它，然后查看特定于Mozilla的属性并应用它。

在Firefox中试用你的代码 - 我敢打赌它会正常工作，除了它会显示Mozilla属性而不是webkit属性。

此外，如果这应该是CSS3，您应该只能使用linear-gradient而不是特定于供应商的那些，然后它也可以在所有兼容CSS3的浏览器中使用。< / p>

编辑：除了linear-gradient之外，实际上并不支持。因此，您应该使用这些特定于供应商的值，并使用-ms-linear-gradient来支持IE，-o-linear-gradient来支持Opera，并使用linear-gradient以便将来兼容。 ;）

jquery跨浏览器css3内联样式

2 个答案: