The most important tags in HTML are tags that define headings, paragraphs and line breaks.
Basic HTML Tags
<html> Defines an HTML document
<body> Defines the document's body
<h1> to <h6> Defines header 1 to header 6
<p> Defines a paragraph
<br> Inserts a single line break
<hr> Defines a horizontal rule
<!--> Defines a comment
Headings are defined with the <h1> to <h6> tags. <h1> defines the largest heading while <h6> defines
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6> This is a heading</h6>
HTML automatically adds an extra blank line before and after a heading. A useful heading attribute is
<h5 align=”left”>I can align headings </h5>
<h5 align=”center”>This is a centered heading </h5>
<h5 align=”right”>This is a heading aligned to the right </h5>
Paragraphs are defined with the <p> tag. Think of a paragraph as a block of text. You can use the align
attribute with a paragraph tag as well.
<p align=”left”>This is a paragraph</p>
<p align=”center”>this is another paragraph</p>
Important: You must indicate paragraphs with <p> elements. A browser ignores any
indentations or blank lines in the source text. Without <p> elements, the document becomes
one large paragraph. HTML automatically adds an extra blank line before and after a paragraph.
The <br> tag is used when you want to start a new line, but don’t want to start a new paragraph. The
<br> tag forces a line break wherever you place it. It is similar to single spacing in a document.
<p>This <br> is a para<br> graph with
is a para
graph with line breaks
The <br> tag has no closing tag.
The <hr> element is used for horizontal rules that act as dividers between sections, like this:
The horizontal rule does not have a closing tag. It takes attributes such as align and width. For
<hr width=”50%” align=”center”>Would Display
Comments in HTML
The comment tag is used to insert a comment in the HTML source code. A comment can be placed
anywhere in the document and the browser will ignore everything inside the brackets. You can use
comments to write notes to yourself, or write a helpful message to someone looking at your source
<p> This html comment would <!– This
is a comment –> be displayed like
This HTML comment would be displayed like
Notice you don’t see the text between the tags <!– and –>. If you look at the source code, you
would see the comment. To view the source code for this page, in your browser window, select View
and then select Source.
Note: You need an exclamation point after the opening bracket <!– but not before the closing
HTML automatically adds an extra blank line before and after some elements, like before and after a
paragraph, and before and after a heading. If you want to insert blank lines into your document, use
the <br> tag.
Try It Out!
Open your text editor and type the following text:
<title>My First Webpage</title>
<h1 align="center">My First Webpage</h1>
<p>Welcome to my first web page. I am writing this page using a text editor and plain
<p>By learning html, I'll be able to create web pages like a pro....<br>
which I am of course.</p>
Save the page as mypage2.html. Open the file in your Internet browser.
Other HTML Tags
As mentioned before, there are logical styles that describe what the text should be and physical styles
which actually provide physical formatting. It is recommended to use the logical tags and use style
sheets to style the text in those tags.
<abbr> Defines an abbreviation
<acronym> Defines an acronym
<address> Defines an address element
<cite> Defines a citation
<code> Defines computer code text
<blockquote> Defines a long quotation
<del> Defines text
<dfn> Defines a definition term
<em> Defines emphasized text
<ins> Defines inserted text
<kbd> Defines keyboard text
<pre> Defines preformatted text
<q> Defines a short quotation
<samp> Defines sample computer code
<strong> Defines strong text
<var> Defines a variable
<b> Defines bold text
<big> Defines big text
<i> Defines italic text
<small> Defines small text
<sup> Defines superscripted text
<sub> Defines subscripted text
<tt> Defines teletype text
<u> Deprecated. Use styles instead
Character tags like <strong> and <em> produce the same physical display as <b> and <i> but are more
uniformly supported across different browsers.
The following paragraph uses the <blockquote> tag. In the previous sentence, the blockquote tag is
enclosed in the <samp> Sample tag.
We the people of the United States, in order to form a more perfect Union, establish Justice,
insure domestic Tranquility, provide for the common defense, promote the general Welfare, and
secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this
Constitution for the United States of America.
Although most browsers render blockquoted text by indenting it, that’s not specifically what it’s
designed to do. It’s conceivable that some future browser may render blockquoted text in some other
way. However, for the time being, it is perfectly safe to indent blocks of text with the <blockquote>.
<abbr title=”World Wide Web”>WWW</abbr> Would Display WWW
When you hold your mouse pointer over the WWW, text in the title attribute will appear in.