Borders using CSS
Borders can be used for many things, for example as a decorative element or to underline a separation of two things. CSS gives you endless options when using borders in your pages.
The width of borders is defined by the property border-width, which can obtain the values thin, medium, and thick, or a numeric value, indicated in pixels.
The property border-color defines which color the border has.
There are different types of borders to choose from. You can set the type using border-style property. The values none or hidden can be used if you do not want any border.
- dotted
- dashed
- solid
- double
- groove
- ridge
- inset
- outset
- none
Compilation: border
You can compile many properties into one using border. For example,
p {
border-width: 1px;
border-style: solid;
border-color: blue;
}
This can be compiled into:
p {
border: 1px solid blue;
}