Looking at the source code of our sample file, you'll see that I've used
unless I wanted single spacing, in which case I've used This is simply to make formatting the individual paragraphs easier should we decide we want to make changes to them.
As it is, this is a pretty dull document. So let's beef up the main heading titles by making them bigger and bolder...like the headings you would see in a textbook.
Headings
Headings (not to be confused with the header of the HTML file) are a quick means of formatting text. HTML recognizes six pre-formatted heading tags, each providing a slightly different style. The available heading tags are: and are applied like this:
Text for Heading
H1 looks like this
H2 looks like this
H3 looks like this
H4 looks like this
H5 looks like this
H6 looks like this
As you can see, the formatting of the tag creates the largest text, while gives you the smallest. (Just remember, the smaller the number, the larger the text.)
Adding headings
In our document, the first sentence, "Tree of Life Garden" is the title of the page, so we'll make it the largest by applying the tag, like this:
The next line, "Designing with HTML", is the document name. We don't want that as large as the main title, so we'll step it down one level and apply to that one. The other eight headings (A Lesson from Psyche, Why are we doing this?, Signing up for lessons, What's in it for me?, What do I need to participate?, Academy Lessons, Miscellaneous Goodies, and External Resources) are all subsections of the document, so we'll go down one more level and apply to those.
Headings, like paragraphs, require a closing tag and are automatically formatted to create a double line break when the tag is closed. So, since they're no longer needed, don't forget to remove the tags from the various headings, before applying the appropriate heading tag, like this:
After you've added the tags to all the sub-headings. Your document should look like this:
Tree of Life Garden
Designing with HTML
Arachnes's Web presents a tutorial designed to help the (as yet) technologically challenged overcome HTML stage fright and begin to enjoy coding at home.
You can download a copy of the blank html file here.
A Lesson from Psyche
CSS, the Aphrodite of web coding, says...
Academy Lessons
HTML/XHTML
Cascading Stylesheets....
| Some of the Available Attributes for Heading Tags |
| Attribute | Value | Use |
| align |
left, center, right, justify |
specifies the alignment of the text in the header. |