CSS border attribute

Definition and Usage

The border shorthand property sets all border properties in one declaration.

The following properties can be set in order:

If a value is not set, it will not cause any problems, for example, border:solid #ff0000; is also allowed.

See also:

CSS Tutorial:CSS Borders

HTML DOM Reference Manual:border property

Example

Set the style of 4 borders:

p
  {
  border:5px solid red;
  }

Try it yourself

CSS Syntax

border: border-width border-style border-color|initial|inherit;

Property Value

Value Description
border-width Specifies the border width. See also:border-width Possible values in
border-style Specifies the border style. See also:border-style Possible values in
border-color Specifies the border color. See also:border-color Possible values in
inherit Specifies that the border property settings should be inherited from the parent element.

Technical Details

Default Value: not specified
Inheritance: no
Version: CSS1
JavaScript Syntax: object.style.border="3px solid blue"

More examples

All border properties in one declaration
This example demonstrates how to set all four border properties in the same declaration using shorthand properties.

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5