Borders
To make a border around an element, all you need is border-style. The values can be solid, dotted, dashed, double, groove, ridge, inset and outset.
border-width sets the width of the border, most commonly using pixels as a value. There are also properties for border-top-width, border-right-width, border-bottom-width and border-left-width.
Finally, border-color sets the color.
Put It To Work
Time to put some borders on our document! Go to you CSS document and create a new h2 add the following snippet of code:
See the Pen Intro to CSS: Part 6 – Borders by Tim Mumford (@mumfordt) on CodePen.
What happens? You should now see his will make a red solid border around all HTML secondary headers (the
h2 element) that is 3 pixels wide on the top and bottom and 10 pixels wide on the left and right (these having over-ridden the 3 pixel wide width of the entire border). Almost done! Let's wrap up:
Go to: Wrap Up