Contents
Defining border in CSS
The CSS border
property allows you to define a line border for an element:
It is actually a shorthand for three CSS line border subproperties:
border-width
- border-style
border-color
Working with border: CSS syntax
To define a line border in CSS, follow the syntax example below:
border: width style color;
The available values will be explained in the following section.
Theory is great, but we recommend digging deeper!
Property values
Value | Description | Defined in | Default value |
---|---|---|---|
width | CSS border width | Length units or keywords (thin , medium , thick ) |
medium |
style | CSS border style | Keywords (none , solid , hidden , dashed , dotted , double , groove , ridge , inset , outset ) |
none |
color | CSS border color | Color names, RGB, RGBA, HEX, HSL or HSLA values. | currentcolor |
Note: you don't need to define all of the subproperties for line borders necessarily. The order is also not important.
Browser support

Chrome
1+

Edge
12+

Firefox
1+

IE
4+

Opera
3.5+

Safari
1+
Mobile browser support

Chrome
18+

Firefox
4+

Safari
1+