使用jQuery添加CSS

在web开发中，我们通常需要动态地改变页面上元素的样式，这时候就需要使用到CSS。在使用jQuery时，我们可以通过代码动态地为元素添加CSS样式。

以下为代码示例：

// 选取元素并添加CSS样式
$( "selector" ).css( "property", "value" );

//添加多个CSS样式
$( "selector" ).css({
  "property1": "value1",
  "property2": "value2"
});

其中，selector是要选取的元素，可以是元素的标签名、类名、id、属性选择器等等，property是要添加的CSS属性名，value是对应的属性值。如果要添加多个CSS属性，可以将它们放在一个JavaScript对象里，如上述代码所示。

具体来看，下面是三个例子：

例1：改变颜色

$( "button" ).css( "background-color", "red" );

以上代码会把所有 <button> 元素的背景色设置成红色。

例2：添加多个CSS属性

$( "p" ).css({
  "background-color": "yellow",
  "font-size": "200%",
  "border": "1px solid black"
});

以上代码会把所有 <p> 元素的背景色设置为黄色，字体大小增加到200％，还会添加一个1像素宽的黑色边框。

例3：添加类名

$( "button" ).addClass( "btn-danger" );

以上代码会给所有 <button> 元素添加一个名为 btn-danger 的类。

在以上三个例子中，我们使用了不同的选择器选择元素并为它们添加CSS样式。通过这种方式，我们可以在网页上动态地修改元素的样式，达到更好的用户体验。