jquery - 实现多个 CSS 属性的问题

Question

我想使用 jQuery 更改元素的 css。

$('p').css({
    padding-left : '6px',
    border-left : '5px solid #555'
});

这没用。

但是，当我使用

$('p').css('padding-left','6px');
$('p').css('border-left','5px');

有用...

我在这里做错了什么？

谢谢

score 6 · Accepted Answer

您必须将属性（样式属性）包装在 qoutes（'' 或 ""）中。

这是因为它们包含破折号 (-)。

$('p').css({
    'padding-left' : '6px',
    'border-left' : '5px solid #555'
});

score 3 · Accepted Answer

更好地使用这种方式：

$('p').css({
    paddingLeft : '6px',
    borderLeft : '5px solid #555'
});

在 css 中，我们使用连字符-分隔所有小写字母并用""单引号或双引号括起来。这种方式在 js/jQuery 中：

    'padding-left' : '6px',
    'border-left' : '5px solid #555'
//--^-----------^----------------------here

在 js 中，所有 css 属性都可以通过以下方式在 camelCase 中访问：

    paddingLeft : '6px',
    borderLeft : '5px solid #555'
//--^^^^^^^^^^------------------------this way

score 2 · Accepted Answer

因为您没有在第一段代码的引号内定义它们。

$('p').css({
    'padding-left' : '6px',
    'border-left' : '5px solid #555'
});

应该管用。

score 1 · Accepted Answer

只是缺少引号

$('p').css({
    'padding-left' : '6px',
    'border-left' : '5px solid #555'
});

score 1 · Accepted Answer

1

尝试

$('p').css({
    'padding-left':'6px',
    'border-left':'5px solid #555'
});

于 2013-03-28T14:01:57.233 回答

5 回答 5