jQuery库支持Cascading Style Sheet(CSS)规范1到3中包含的几乎所有选择器，如万维网联盟网站所述.
使用JQuery库开发人员只要浏览器启用了JavaScript，就可以增强他们的网站而不必担心浏览器及其版本.
大多数JQuery CSS方法都不会修改jQuery对象的内容并使用它们在DOM元素上应用CSS属性.
使用JQuery方法 css应用任何CSS属性非常简单( PropertyName，PropertyValue).
以下是方法的语法 :
selector.css( PropertyName, PropertyValue );
您可以在此处传递 PropertyName 作为javascript字符串，并根据其值， PropertyValue 可以是字符串或整数.
以下是将字体颜色添加到第二个列表项的示例.
<html>
<head>
<title>The jQuery Example</title>
<script type = "text/javascript"
src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
<script type = "text/javascript" language = "javascript">
$(document).ready(function() {
$("li").eq(2).css("color", "red");
});
</script>
</head>
<body>
<div>
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
<li>list item 6</li>
</ul>
</div>
</body>
</html>您可以使用单个JQuery方法CSS({key1:val1，key2:val2 ....)应用多个CSS属性. 您可以在一次通话中应用任意数量的属性.
以下是该方法的语法:
selector.css( {key1:val1, key2:val2....keyN:valN})在这里，您可以将key作为property和val传递为其值，如上所述.
以下是将字体颜色和背景颜色添加到第二个列表项的示例.
<html>
<head>
<title>The jQuery Example</title>
<script type = "text/javascript"
src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
<script type = "text/javascript" language = "javascript">
$(document).ready(function() {
$("li").eq(2).css({"color":"red", "background-color":"green"});
});
</script>
</head>
<body>
<div>
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
<li>list item 6</li>
</ul>
</div>
</body>
</html>width(val)和height(val)方法可用于分别设置任何元素的宽度和高度.
下面是一个简单的示例，它设置第一个分割元素的宽度，其中其余元素的宽度由样式表设置
<html>
<head>
<title>The jQuery Example</title>
<script type = "text/javascript"
src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
<script type = "text/javascript" language = "javascript">
$(document).ready(function() {
$("div:first").width(100);
$("div:first").css("background-color", "blue");
});
</script>
<style>
div {
width:70px; height:50px; float:left;
margin:5px; background:red; cursor:pointer;
}
</style>
</head>
<body>
<div></div>
<div>d</div>
<div>d</div>
<div>d</div>
<div>d</div>
</body>
</html>下表列出了所有方法您可以使用CSS属性 :
| Sr .No. | 方法&说明 |
|---|---|
| 1 | css(name) 在第一个匹配的元素上返回一个样式属性. |
| 2 | css(name，value) 将单个样式属性设置为所有匹配元素的值. |
| 3 | css(properties) 将键/值对象设置为所有匹配元素的样式属性. |
| 4 | height(val) 设置每个匹配元素的CSS高度. |
| 5 | height() 获取当前的公司mputed，pixel，第一个匹配元素的高度. |
| 6 | innerHeight() 获取内部高度(不包括边框)并包含第一个匹配元素的填充. |
| 7 | innerWidth() 获取内部宽度(不包括边框)并包含第一个匹配元素的填充. |
| 8 | offset() 获取第一个匹配的当前偏移量元素，以像素为单位，相对于文档. |
| 9 | offsetParent() 返回定位父级为的jQuery集合该第一个匹配的元素. |
| 10 | outerHeight([margin]) 获取外部高度(默认情况下包括边框和填充) )为第一个匹配的元素. |
| 11 | outerWidth([margin]) 获取外部宽度(包括边框和第一个匹配元素的默认填充. |
| 12 | position() 获取元素的顶部和左侧位置相对于其偏移的父级. |
| 13 | scrollLeft(val) 传入值时，向左滚动offset设置为all的值匹配元素. |
| 14 | scrollLeft() 获取第一个匹配元素的向左滚动偏移量. |
| 15 | scrollTop(val) 传入值时，滚动顶部偏移量将设置为所有匹配元素上的值. |
| 16 | scrollTop() 获取第一个匹配元素的滚动顶部偏移量. |
| 17 | width(val) 设置每个匹配元素的CSS宽度. |
| 18 | width() 获取第一个匹配元素的当前计算，像素，宽度. |
