Click here to navigate the course.

Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!

Code Editor
Web Browser

Great work! In this lesson, you learned how to style a box's border.

Let's review what you learned:

  1. You can style the borders of an element's box.
  2. The border-width property allows you to set the thickness, or width, of a border.
  3. The border-style property allows you to change the style of border used.
  4. The border-color property allows you to change the color of a border.
  5. Individually setting the style, thickness, and color of a border can bloat code. It's more efficient to use the shorthand border property and specify all three properties at once, in that order.
  6. Box borders don't have to be square. Their corners can be rounded with the border-radius property.

So far, we've focused on two aspects of the box: dimensions and borders. In the next unit, we'll focus on the content within the box and the space outside of the box.


Take some time to experiement with your new knowledge of borders in style.css. When you're done, proceed to the next unit.

Report a Bug
If you see a bug or any other issue with this page, please report it here.