Question

我使用jQuery创建了一个按钮生成器，并希望将多个浏览器的样式添加到元素中。我用这段代码做到了这一点：

    jQuery('.previewButton').css('background','');
    var s = jQuery('.bg_start_color').val();
    var e = jQuery('.bg_end_color').val();
    jQuery('.previewButton').css('background-color',s);
    jQuery('.previewButton').css('background','-webkit-gradient(linear, 0% 0%, 0% 100%, from('+s+'), to('+e+'))');
    jQuery('.previewButton').css('background','-webkit-linear-gradient(top,'+s+', '+e+')');
    jQuery('.previewButton').css('background','-moz-linear-gradient(top,'+s+','+e+')');
    jQuery('.previewButton').css('background','-ms-linear-gradient(top,'+s+','+e+')');
    jQuery('.previewButton').css('background','-o-linear-gradient(top,'+s+','+e+')');

我面临的问题是，当我在Safari中使用它时，-webkit-风格应用于元素.previewButton。当我在Firefox中使用生成器时，-moz-样式应用于按钮。我想保存数据库中的按钮，并且肯定希望保存所有跨浏览器的相关样式，而不仅仅是我正在处理的那个。

但是，如果代码说应该应用所有内容，为什么只有与浏览器相关的样式应用于该元素？我怎么能改变它？有人知道吗？

感谢。

Answer 1

跟踪颜色值，然后在将样式写入数据库时，在css中包含所有broswer特定样式 - 而不仅仅是当前应用于按钮的样式

Answer 2

浏览器只会应用他们理解的CSS样式。例如，Safari不理解带有-moz-或-ms-前缀的样式，因此它只是忽略它们。这就是为什么它可能不会出现在您的Web检查器中。这并不意味着您的跨浏览器样式不存在。它只是意味着您当前的浏览器没有查看它们，因为它不理解它们。

别担心，一切正常。

jQuery - 将跨浏览器的CSS样式添加到元素

2 个答案: