2.2 - More HTML Tags
Big Review
We have looked at the structure of an HTML document and some basic tags
<!doctype html>
<head> vs <body>
<title> (inside head) for the browser tab at the top (in Replit you need to open in a new window)
We also played with <h1> <p> <b> <i> <br> and <img src="filename">
We talked briefly about relative URLs (link to a file on your own site) and absolute URLs (link to another site)
"./" means current folder and "../" means one folder back
Remember that most tags need a closing tag to stop that element (like bold) but some do not (like an image)
w3schools and Google are your best friend!
Today's Lesson: 2.2 - HTML Tags
Please keep in mind that some tutorials use bad indentation (or even worse - none!). Practice the indentation demonstrated in class!
When you use a tag you are writing HTML syntax to create Elements on the page
Today's lesson is an in-class demo (no slides). We will cover the following:
HTML Attributes (the "settings" of an element)
HTML "Headings" vs. <head> and <title>
<p> vs <pre> vs <code>
The comment tag <!-- comment here -->
Lists, both numbered <ol> and not numbered <ul>
Note - we are not learning the "style" attribute just yet. Any work you do on your own that changes colour, font, or other style attributes is on your own. There are three (3) ways to apply style attributes and we will be learning that soon enough.
Today's Task(s) / Homework
Complete the Replit project titled 2.2 - More HTML Tags, submit it by noon tomorrow.
Extra
Entire list of tags by category and by alphabet
You should read through the HTML style guide
Want to try something a little more tricky? Check out HTML tables