CSS border-top property

Definition and usage

The border-top shorthand property sets all the properties of the top border 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-top:solid #ff0000; is also allowed.

See also:

CSS Tutorial:CSS Borders

HTML DOM Reference Manual:borderTop property

Example

Set the style of the top border:

p
  {
  border-style:solid;
  border-top:thick double #ff0000;
  }

Try it yourself

CSS syntax

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

Property value

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

Technical details

Default value: not specified
Inheritance: no
Version: CSS1
JavaScript syntax: object.style.borderTop="3px solid blue"

More examples

All top border properties in one declaration
This example demonstrates using a shorthand property to set all top border properties in a single declaration.

Browser support

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

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

Note:Browsers prior to IE7 do not support the value "inherit". IE8 requires !DOCTYPE. IE9 supports "inherit".