jQuery documentation jQuery documentation| name | String | The name of the property to access. |
|---|
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.
Retrieves the color style of the first paragraph
<p style="color:red;">Test Paragraph.</p>
$("p").css("color");
"red"
Retrieves the font-weight style of the first paragraph.
<p style="font-weight: bold;">Test Paragraph.</p>
$("p").css("font-weight");
"bold"
| properties | Map | Key/value pairs to set as style 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.
Sets color and background styles to all p elements.
<p>Test Paragraph.</p>
$("p").css({ color: "red", background: "blue" });
<p style="color:red; background:blue;">Test Paragraph.</p>
| key | String | The name of the property to set. |
|---|---|---|
| value | String|Number | The value to set the property to. |
Set a single style property to a value, on all matched elements. If a number is provided, it is automatically converted into a pixel value.
Changes the color of all paragraphs to red
<p>Test Paragraph.</p>
$("p").css("color","red");
<p style="color:red;">Test Paragraph.</p>
Changes the left of all paragraphs to "30px"
<p>Test Paragraph.</p>
$("p").css("left",30);
<p style="left:30px;">Test Paragraph.</p>
Get the current computed, pixel, width of the first matched element.
<p>This is just a test.</p>
$("p").width();
300
| val | String|Number | Set the CSS property to the specified value. |
|---|
Set the CSS width of every matched element. If no explicit unit was specified (like 'em' or '%') then "px" is added to the width.
<p>This is just a test.</p>
$("p").width(20);
<p style="width:20px;">This is just a test.</p>
<p>This is just a test.</p>
$("p").width("20em");
<p style="width:20em;">This is just a test.</p>
Get the current computed, pixel, height of the first matched element.
<p>This is just a test.</p>
$("p").height();
300
| val | String|Number | Set the CSS property to the specified value. |
|---|
Set the CSS width of every matched element. If no explicit unit was specified (like 'em' or '%') then "px" is added to the width.
<p>This is just a test.</p>
$("p").height(20);
<p style="height:20px;">This is just a test.</p>
<p>This is just a test.</p>
$("p").height("20em");
<p style="height:20em;">This is just a test.</p>