在前端开发中，我们经常需要为页面中的元素添加样式。jQuery是一个流行的JavaScript库，它提供了方便的方法来操作DOM和设置样式。其中，CSS()方法可以用来为指定的元素设置样式。
CSS()方法介绍
CSS()方法允许我们动态地将一个或多个样式属性应用于已选择的元素。其语法如下：
$(selector).css(property, value);
其中，selector表示要选择的元素，可以是任何有效的CSS选择器；property表示要设置的CSS属性名称，比如"color"、"background-color"等；value表示要设置的CSS属性值，可以是任何有效的CSS值。
CSS()方法也可以接受一个对象作为参数，以一次性设置多个CSS属性及其对应的值：
$(selector).css({
property1: value1,
property2: value2,
...
});给指定元素同时设置多个样式
使用CSS()方法为一个元素设置单个样式属性非常简单，例如：
$("#myElement").css("color", "red");上面的代码将ID为"myElement"的元素的文本颜色设置为红色。但是，如果我们想要同时设置多个样式属性，该怎么办呢？这时，我们可以使用对象形式的参数，例如：
$("#myElement").css({
"color": "red",
"background-color": "yellow",
"font-size": "16px"
});上面的代码将ID为"myElement"的元素的文本颜色设置为红色，背景颜色设置为黄色，字体大小设置为16像素。这个方法可以同时设置多个样式属性，非常方便。
深度学习与指导意义
虽然CSS()方法看起来很简单，但是它实际上涉及了一些CSS基础知识。例如，你需要知道每个CSS属性对应的值的类型，比如颜色、长度、百分比等。此外，还需要了解不同的CSS盒子模型、选择器、优先级等概念，以便能够编写更复杂的样式规则。
在使用CSS()方法时，我们也需要注意一些细节。例如，样式属性名称应该用驼峰命名法（比如"backgroundColor"），而不是短横线分隔符（比如"background-color"）。另外，要注意CSS优先级和继承的影响，以确保设置的样式能够正确地应用到指定的元素上。
总之，理解CSS基础知识和细节非常重要，这有助于我们更好地使用jQuery的CSS()方法，以及编写出更高质量的前端代码。
示例代码
下面是一个使用CSS()方法为多个元素设置样式的示例代码：
-- -------------------- ---- -------
--------- -----
------
------
------------- ----- ------ ------------
-------
-------- -
-------- -----
------- --- ----- ------
---------- -----
-
--------
-------
------
---- ---------- ---------------------- ------------
-- ----------- --------------------- ----- ----- --- ---------
------- -----------------------------------------------------------
--------
---------------------------- -
---------- ---------------
------------------- -------
-------- ------
---
---
---------
-------
-------在上面的代码中，我们为ID为"myDiv"和"myPara"的两个元素同时设置了
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/2541