Skip to main content
Version: v1.1

✏️ 1.1.3.4 Practice: Divs and Spans

Goal: Practice using the the tags we learned in the lesson:

  • <div> tags — places to add classes to large parts of our page and separate out content
  • <span> tags — places to add classes to content within block elements

Warm Up​

  • What is the difference between a div and a span?
  • When would you use a span but not a div?
  • When would you use a div but not a span?

Code​

Meet the goal by completing one of these projects. Make sure to make commits regularly and push to the project's remote repository on GitHub.

Boring Lecture​

  • Rewrite the boring-lecture page and remove the intro class from the elements themselves, and create a <div> with the intro class to hold the elements.

Blogging Site​

  • Create a new blogging website about whatever you want and use <div>s to group together and style each blog post.
  • On the blogging website, create an "about me" section that's styled differently from the rest of the page.

Resume Site​

  • Start a new webpage to house your resume. Use <div>s and <span>s to style sections for your education, work experience, skills, etc.