# jQuery website jQuery documentation

## CSS

### css(String name) : String

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.

#### Examples

Retrieves the color style of the first paragraph

##### Before

    <p style="color:red;">Test Paragraph.</p>

##### Code

    $("p").css("color");

##### Result

    "red"

Retrieves the font-weight style of the first paragraph.

##### Before

    <p style="font-weight: bold;">Test Paragraph.</p>

##### Code

    $("p").css("font-weight");

##### Result

    "bold"

### css(Map properties) : jQuery

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.

#### Example

Sets color and background styles to all p elements.

##### Before

    <p>Test Paragraph.</p>

##### Code

    $("p").css({ color: "red", background: "blue" });

##### Result

    <p style="color:red; background:blue;">Test Paragraph.</p>

### css(String key, String|Number value) : jQuery

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.

#### Examples

Changes the color of all paragraphs to red

##### Before

    <p>Test Paragraph.</p>

##### Code

    $("p").css("color","red");

##### Result

    <p style="color:red;">Test Paragraph.</p>

Changes the left of all paragraphs to "30px"

##### Before

    <p>Test Paragraph.</p>

##### Code

    $("p").css("left",30);

##### Result

    <p style="left:30px;">Test Paragraph.</p>

### width() : String

Get the current computed, pixel, width of the first matched element.

#### Example

##### Before

    <p>This is just a test.</p>

##### Code

    $("p").width();

##### Result

    300

### width(String|Number val) : jQuery

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.

#### Examples

##### Before

    <p>This is just a test.</p>

##### Code

    $("p").width(20);

##### Result

    <p style="width:20px;">This is just a test.</p>

##### Before

    <p>This is just a test.</p>

##### Code

    $("p").width("20em");

##### Result

    <p style="width:20em;">This is just a test.</p>

### height() : String

Get the current computed, pixel, height of the first matched element.

#### Example

##### Before

    <p>This is just a test.</p>

##### Code

    $("p").height();

##### Result

    300

### height(String|Number val) : jQuery

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.

#### Examples

##### Before

    <p>This is just a test.</p>

##### Code

    $("p").height(20);

##### Result

    <p style="height:20px;">This is just a test.</p>

##### Before

    <p>This is just a test.</p>

##### Code

    $("p").height("20em");

##### Result

    <p style="height:20em;">This is just a test.</p>