Saturday, August 29, 2009

Basic HTML Tags

Basic HTML Tags

The most important tags in HTML are tags that define headings, paragraphs and line breaks.
The best way to learn HTML is to work with examples. We have created a very nice HTML editor for you. With this editor, you can edit the HTML source code if you like, and click on a test button to view the result.

Try it Yourself - Examples
A very simple HTML document
This example is a very simple HTML document, with only a minimum of HTML tags. It demonstrates how the text inside a body element is displayed in the browser. 
The content of the body element is displayed in your browser.
Simple paragraphs
This example demonstrates how the text inside paragraph elements is displayed in the browser.
This is a paragraph.

This is a paragraph.

This is a paragraph.

Paragraph elements are defined by the p tag.

(You can find more examples at the bottom of this page)

Headings
Headings are defined with the

to

tags.

defines the largest heading.

defines the smallest heading.

This is a heading


This is a heading


This is a heading


This is a heading


This is a heading

This is a heading

HTML automatically adds an extra blank line before and after a heading.

Paragraphs
Paragraphs are defined with the
tag.
This is a paragraph

This is another paragraph

HTML automatically adds an extra blank line before and after a paragraph.

Don't Forget the Closing Tag
You might have noticed that paragraphs can be written without end tags
:
This is a paragraph
This is another paragraph
The example above will work in most browsers, but don't rely on it. Future version of HTML will not allow you to skip ANY end tags.
Closing all HTML elements with an end tag is a future-proof way of writing HTML. It also makes the code easier to understand (read and browse) when you mark both where an element starts and where it ends.

Line Breaks
The
tag is used when you want to break a line, but don't want to start a new paragraph. The
tag forces a line break wherever you place it.
This
is a para
graph with line breaks


To break
lines
in a
paragraph,
use the br tag.

The
tag is an empty tag. It has no end tag like , since a closing tag doesn't make any sense.


or
More and more often you will see the
tag written like this:
Because the
tag has no end tag (or closing tag), it breaks one of the rules for future HTML (the XML based XHTML), namely that all elements must be closed.
Writing it like
is a future proof way of closing (or ending) the tag inside the opening tag, accepted by both HTML and XML.

Comments in HTML
The comment tag is used to insert a comment in the HTML source code. A comment will be ignored by the browser. You can use comments to explain your code, which can help you when you edit the source code at a later date.
Note that you need an exclamation point after the opening bracket, but not before the closing bracket.

Recap on HTML Elements
  • Each HTML element has an element name (body, h1, p, br)
  • The start tag is the name surrounded by angle brackets:


  • The end tag is a slash and the name surrounded by angle brackets

  • The element content occurs between the start tag and the end tag
  • Some HTML elements have no content
  • Some HTML elements have no end tag

No comments:

Post a Comment