jQuery1.1 API 中文版 第三部分CSS
url: http://jquery.org.cn/visual/cn/index.xml
第三部分CSS
1. css(name)
访问第一个匹配元素的样式属性。使用这个方法可以很容易地取得第一个匹配元素的样式属性的值。
Access a style property on the first matched element. This method makes it easy to retrieve a style property value from the first matched element.
返回值
String
参数
name (String): 要访问的属性名称
示例
说明:
取得第一个段落的color样式属性的值。
HTML 代码:
<p style="color:red;">Test Paragraph.</p>
jQuery 代码:
$("p").css("color");
结果:
"red"
--------------------------------------------------------------------------------
说明:
取得第一个段落的font-weight样式属性的值。
HTML 代码:
<p style="font-weight: bold;">Test Paragraph.</p>
jQuery 代码:
$("p").css("font-weight");
结果:
"bold"
2. css(properties)
把一个“名/值对”对象设置为所有匹配元素的样式属性。 这是一种在所有匹配的元素上设置大量样式属性的最佳方式。
Set a key/value object as style properties to all matched elements. This serves as the best way to set a large number of style properties on all matched elements.
返回值
jQuery
参数
properties (Map): 要设置为样式属性的名/值对对象
示例
说明:
为所有p元素设置color和background样式属性。
HTML 代码:
<p>Test Paragraph.</p>
jQuery 代码:
$("p").css({ color: "red", background: "blue" });
结果:
<p style="color:red; background:blue;">Test Paragraph.</p>
3. css(key, value)
在所有匹配的元素中,设置一个样式属性的值。
Set a single style property to a value, on all matched elements.
返回值
jQuery
参数
key (String): 要设置的样式属性名称
value (Object): 要设置的样式属性的值
示例
说明:
把所有段落的color样式属性值改为红色。
HTML 代码:
<p>Test Paragraph.</p>
jQuery 代码:
$("p").css("color","red");
结果:
<p style="color:red;">Test Paragraph.</p>
--------------------------------------------------------------------------------
说明:
把所有段落的left样式属性值设置为"30px"
HTML 代码:
<p>Test Paragraph.</p>
jQuery 代码:
$("p").css("left",30);
结果:
<p style="left:30px;">Test Paragraph.</p>
4. height()
取得第一个匹配元素当前计算的高度值(px)。
Get the current computed, pixel, height of the first matched element.
返回值
String
示例
HTML 代码:
<p>This is just a test.</p>
jQuery 代码:
$("p").height();
结果:
300
5. height(val)
为每个匹配的元素设置CSS高度(width)属性的值。如果没有明确指定单位(如:em或%),使用px。
Set the CSS width of every matched element. If no explicit unit was specified (like 'em' or '%') then "px" is added to the width.
返回值
jQuery
参数
val (String|Number): 要设置的高度值
示例
HTML 代码:
<p>This is just a test.</p>
jQuery 代码:
$("p").height(20);
结果:
<p style="height:20px;">This is just a test.</p>
--------------------------------------------------------------------------------
HTML 代码:
<p>This is just a test.</p>
jQuery 代码:
$("p").height("20em");
结果:
<p style="height:20em;">This is just a test.</p>
6. width()
取得第一个匹配元素当前计算的宽度值(px)。
Get the current computed, pixel, width of the first matched element.
返回值
String
示例
HTML 代码:
<p>This is just a test.</p>
jQuery 代码:
$("p").width();
结果:
300
7. width(val)
为每个匹配的元素设置CSS宽度(width)属性的值。如果没有明确指定单位(如:em或%),使用px。
Set the CSS width of every matched element. If no explicit unit was specified (like 'em' or '%') then "px" is added to the width.
返回值
jQuery
参数
val (String|Number): 要设置的宽度值
示例
HTML 代码:
<p>This is just a test.</p>
jQuery 代码:
$("p").width(20);
结果:
<p style="width:20px;">This is just a test.</p>
--------------------------------------------------------------------------------
HTML 代码:
<p>This is just a test.</p>
jQuery 代码:
$("p").width("20em");
结果:
<p style="width:20em;">This is just a test.</p>