3

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

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

这没用。

但是，当我使用

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

有用...

我在这里做错了什么？

谢谢

4

5 回答 5

6

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

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

工作演示

$('p').css({
    'padding-left' : '6px',
    'border-left' : '5px solid #555'
});
于 2013-03-28T13:59:55.417 回答
3

更好地使用这种方式：

在这里检查一下小提琴

$('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
于 2013-03-28T14:03:45.933 回答
2

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

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

应该管用。

于 2013-03-28T14:00:10.817 回答
1

只是缺少引号

$('p').css({
    'padding-left' : '6px',
    'border-left' : '5px solid #555'
});
于 2013-03-28T13:59:59.040 回答
1

尝试

$('p').css({
    'padding-left':'6px',
    'border-left':'5px solid #555'
});
于 2013-03-28T14:01:57.233 回答