Core
Interaction

HTML Quiz

Tuesday, 1/31 – Lab

Instructions

  1. Create a new directory in your github repo named html-quiz.
  2. Inside this directory create a file named index.html. Make sure this is a valid HTML5 document.
  3. Complete the quiz by adding your answers to the index.html file.
  4. At the end of the quiz upload your new file to GitHub. Refer to the Resources page if you need help with the commands to navigate to your directory in the terminal and push to github.

You have 20 minutes to complete the quiz. You may use the internet to help answer the questions if necessary, but don’t share or copy code between students.

Feel free to pick and choose which questions you answer first. Try to answer as many as possible, and move on if you get stuck on one problem.

Questions

  1. Using each HTML heading tag, list your favorite foods ranked by importance.

  2. Create a link to your favorite website, and add a paragraph describing why you like it so much.

  3. Insert an image of your choosing to the page. Make sure the image includes ALT text that describes the image.

  4. Nest several HTML tags inside each other. Make sure to maintain proper indentation.

  5. What elements do all HTML documents have in common?

  6. Create an ordered list of the top 5 cities or countries you’d like to visit.

  7. Use pre tags to create a simple concrete poetry version of a Haiku you write. The Haiku should represent how you feel at this moment. * Hint: pre tags respect whitespace, you can add add lots of spaces and line breaks and they will show up like that when you view the web page.

  8. Write an HTML comment that is hidden from the browser, but displays in the code.

  9. Create a relative link that links to your repository’s home page.

  10. Create an unordered list of some musical artists you like to listen to. Add a class to each list item that matches the genre of music of that artist.

  11. Describe the difference between block-level and inline elements. What is the most common block-level element? What is the most common inline element?

  12. Bonus: use CSS to style the musical genre classes you added in question 9. Assign each genre a color.