Skip to main content

Exercise: HTML Intro

Exercise Repo

Objective#

Practice using HTML tags to structure a content on web pages.

Exercise 1#

Steps are to be completed under the div with id="exercise1"

  1. Create a heading 1 element that contains your name between opening and closing tags
  2. Create a paragraph element that contains a bio about yourself

Exercise 2#

Steps are to be completed under the div with id="exercise2"

  1. Create an unordered list element
  2. Create three list item elements nested inside of the unordered list that your just created
  3. Create an anchor element inside of each list item that you just created in your unordered list
  4. Each anchor element should link to the following:
    • The first anchor element should link to your LinkedIn profile
    • The second anchor element should link to the TrueCoders homepage
    • The third anchor element should link to your most visited website

Exercise 3#

Steps are to be completed under the div with id="exercise3"

  1. Create an image element
  2. Add an src attribute with a relative path value that points to the ./images/example.png file
  3. Add an alt attribute with a text description value of the image

Exercise 4#

Steps are to be completed under the div with id="exercise4"

  1. Edit the paragraph element's text content so that:
    • the word "Bredon" is enclosed in a span element
    • any word "play" is enclosed in an underline element
    • any word "beautiful" is enclosed in an emphasis element
    • any word "point" is enclosed in an strong element

Exercise 5#

Steps are to be completed under the div with id="exercise5"

  1. Edit the blog post so that more semantically meaningful elements are used instead of generic division containers.
    • You will need to use
      • one main element
      • three section elements
      • one article element
      • one header element
      • two nav element
      • two unordered list element
      • five list item elements
      • five anchor elements
      • one footer element
    • To be completed, you should have no more than three division elements and zero span elements (not including the div with id="exercise5")