Question

这个CSS有什么理由不起作用吗？

$('.selector').css(
            'background-color', '#74d04c',
            '-webkit-box-shadow','inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            '-moz-box-shadow','inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            'box-shadow','inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            'border','1px solid #4c8932'
            );

唯一显示的是背景色。

Answer 1

.css获取属性名称和值或地图。你可以这样做：

$('.selector').css('color','blue');

......或者这个：

$('.selector').css({'color':'blue', 'left':'100px'});

问题是你正在混合这两种方法。相反，试试这样：

$('.selector').css({
  'background-color':'#74d04c',
  '-webkit-box-shadow':'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
  etc...
});

Answer 2

我认为你应该使用javascript对象表示法添加不同的规则，而不是作为一个巨大的数组。

更新：是的 - 它接受两个字符串参数（键，值）或键值对的映射。资料来源：http://api.jquery.com/css/

Answer 3

如果要应用多个规则，则必须将css函数传递给JS对象。 More details

$（“selector”）。css（{“background-color”：“red”，“color”：blue}）;

Answer 4

这应该有效：

$('.selector').css({
    'background-color' : '#74d04c',
        '-webkit-box-shadow' : 'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
        '-moz-box-shadow':'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
        'box-shadow':'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
        'border':'1px solid #4c8932'
    });

Demo

Answer 5

修复语法。

$('.selector').css({'background-color' : '#74d04c',             
                    '-webkit-box-shadow' : 'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',             
                    '-moz-box-shadow' : 'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',             
                    'box-shadow' : 'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',             
                    'border' : '1px solid #4c8932'});

Answer 6

如果你想设置多个类似的CSS，你需要use a map：

$('.selector').css({
            'background-color':'#74d04c',
            '-webkit-box-shadow':'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            '-moz-box-shadow':'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            'box-shadow':'inset 0px 1px 0px 0px #dbf383, inset 0px -1px 1px #58c43a',
            'border':'1px solid #4c8932'
            });

jQuery CSS没有应用

6 个答案: