CSS border Property

Example

Set the style of the borders for different elements:

h1 {
  border: 5px solid red;
}

h2 {
  border: 4px dotted blue;
}

div {
  border: double;
}

Definition and Usage

The border property is a shorthand property for:

• border-width
• border-style (required)
• border-color

If border-color is omitted, the color applied will be the color of the text.

Default value:	medium none color
Inherited:	no
Animatable:	yes, see individual properties.
Version:	CSS1
JavaScript syntax:	object.style.border="3px solid blue"

• Inherited : "Inherited = no" means that it cannot takes (inherit) it's value from it's parent element.
• object - object in javascript means the element on which border is applied.
• Animatable - "Animatable = yes" means that it can be animated with CSS @keyframes.

Browser Support

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

Property
border	1.0	4.0	1.0	1.0	3.5

CSS Syntax

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

Property Values

Value	Description	Demo
border-width	Specifies the width of the border. Default value is "medium"
border-style	Specifies the style of the border. Default value is "none"
border-color	Specifies the color of the border. Default value is the color of the text
initial	Sets this property to its default value.
inherit	Inherits this property from its parent element.