CSS Borders
You can use borders applying them to most HTML elements within the body.
All that is needed to make a border around an element is border-style
. The values that are applied can be solid
, dotted
, dashed
, double
, groove
, ridge
, inset
and outset
.
border-width
is used to set the width of the border, which is measured in pixels. Other properties can include border-top-width
, border-right-width
, border-bottom-width
and border-left-width
.
At last, border-color
is used to set the color.
Add the code below to the CSS file:
h2 { border-style: dashed; border-width: 3px; border-left-width: 10px; border-right-width: 10px; border-color: red; }
This will result in a red dashed border appearing around all HTML secondary headers (the h2
element) which has 3 pixels width on the top and bottom and 10 pixels width on the left and right (the 3 pixel wide width of the entire border was overriden as a result).