HTML-Lesson 1

Tags and Templates

Conventions

In this tutorial, new code to typed in your text editor is displayed in bright red and code that you have already typed is in dull red. Text that is personal to you is represented in a light italic text coloured green.

Tags

The content of a web page is held together by html tags. Tags are a letter or letters enclosed in triangular bracket. (Also known as 'less than' and 'greater than'.)

Tags that enclose something, e.g. a web page or a paragraph, have a 'start' tag and an 'end' tag. The 'end' tag is differs from the 'start' tag by the use of a forward slash, '/', immediately after the '<'. E.G.
<tag>content</tag>

Some tags describe items which are complete in themselves. These tags are described as 'empty' tags. I prefer to think of them as being self-closing. E.G.
<tag />
Notice the space and the forward slash.

Tags and attributes are always in lower-case.

Attributes
Tags can contain one or more 'attributes'. An attribute is used to modify or further describe the effect of the tag. An attribute in a tag always takes the following form:
<tag attribute="value">
Note: the 'equals' sign and the 'quotes'.

However

WarningWarning

There is one VERY IMPORTANT point which must be made. Tags can be nested in other tags. E.G. Both 'head' and 'body' tags can be nested inside 'html' tags. What you must NEVER do; NO WAY, NOT SOEVER, NOHOW: You must not interleave tags.
<a>... </a><b>... </b> and
<a>... <b>... </b>... </a> are alright. But
<a>... <b>... </a>... </b> is not!!

Previous Lesson previous lesson next lesson Next Lesson