使用$（this）.css jQuery的多个样式

Question

我正在尝试以下但它不起作用。

 $(this).css('border-bottom', '2px solid red', 'padding-bottom: 26px');

但这有效：

 $(this).css('border-bottom', '2px solid red');

有关实现两种样式属性的最佳方法的任何建议。

Answer 1

您需要对多种样式使用正确的javascript表示法{}。

$(this).css({
    border-bottom:'2px solid red',
    padding-bottom: '26px'
});

http://api.jquery.com/css/#css-properties

Answer 2

您可以将对象传递给jQuery.css()方法

$(this).css({ "border-bottom": "2px solid red", "padding-bottom": "26px" });

你可以在这里看到更多

jQuery .css() Documentation

我建议您在将来参考时为手册添加书签。

jQuery Api Documentation

Answer 3

使用DOM属性样式名称将样式作为属性放在对象中：

$(this).css({ borderBottom: '2px solid red', paddingBottom: '26px');

或CSS样式名称为字符串：

$(this).css({ 'border-bottom': '2px solid red', 'padding-bottom': '26px');

Answer 4

$(this).css({ "background-color": "red", "border-right": "5px solid green" });

非常简单。

来源：http://api.jquery.com/css/

Answer 5

你可以这样做：

$(this).css('border-bottom', '2px solid red');
$(this).css('padding-bottom', '26px');