Skip to main content

✏️ Practice: Inline Elements

Goal: Familiarize yourselves with the usage of inline HTML elements.

Warm Up​

Discuss the following with your partner:

  • What is the difference between block elements and inline elements?
  • What are 2 examples of inline elements?
  • Why is an alt attribute on an image necessary?

Code​

HTML Elements Practice​

Here are some exercises for you to practice using inline HTML elements. Continue to make sure you are using proper indentation to keep your code clean and readable!

  • Add <strong> and <em> tags to your project.
  • Make an img folder to hold photos and make sure the path is correctly written on your webpage. Include images in your website
  • Create links to other websites or to other pages within your website.

Further Exploration​

The "Further Exploration" section contains additional exercises and activities to explore if all other coursework for the day has been completed.

If you and your partner have completed each of today's lessons and exercises thoroughly with time to spare, below are some additional activities to get started on. Continue practicing implementing HTML elements, tracking changes with Git, correct indentation and spacing and pushing to Github.

  • Add additional pages to your animal site. This could include pages for other pets, play date calendar, biography or 'about me' page, a contact page, or anything else you can think up!
  • Create an additional HTML website for any topic of your choosing. This could include your friend's local business, your favorite camping spot, or something dedicated to a hobby you and your partner share. Create multiple pages for the site.

Peer Code Review​

Programming does not happen in a vacuum. It requires collaboration and communication. By reviewing the code of a peer, you are able to see alternative solutions to the same problems that you were tackling. You will also experience what it feels like to walk into a code base that you have not contributed to before — something that will be a regular occurrence outside of Epicodus.

Towards the end of the class session, plan to begin reviewing the code you have written so far of your peers. This is a friendly and informal process.

  • Is the HTML code indented and spaced properly?
  • Are HTML tags opened and closed properly? Are the correct tags being used for the correct purposes?

Also, ask questions. Clarify areas you may not understand. Share ideas. Offer advice and perspective. Admire and support your peers. Embrace the opportunity to support and congratulate each other on completing your first day of code school!