You are on page 1of 8

HTML is a language for describing web pages.

HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup language A markup language is a set of markup tags HTML uses markup tags to describe web pages It is used for the viewing purpose only in a static web page

HTML Tags
HTML markup tags are usually called HTML tags

HTML tags are keywords surrounded by angle brackets like <html> HTML tags normally come in pairs like <b> and </b> The first tag in a pair is the start tag, the second tag is the end tag Start and end tags are also called opening tags and closing tags

HTML Documents = Web Pages


HTML documents describe web pages HTML documents contain HTML tags and plain text HTML documents are also called web pages

The purpose of a web browser (like Internet Explorer or Fire fox) is to read HTML documents and display them as web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page

HTML Element Syntax


An HTML element starts with a start tag / opening tag An HTML element ends with an end tag / closing tag The element content is everything between the start and the end tag Some HTML elements have empty content Empty elements are closed in the start tag Most HTML elements can have attributes

Start Tag
<html> <body> <h1> <h2>,<h3>,<h4>, <h5>,<h6> <p> <a> <img> <br /> <hr/> <!-- This is a comment --> <b> <i>

End Tag
</html> </body> </h1> </h2>,</h3>,</h4>, </h5>,</h6> </P> </a>

Tag Description
The text between <html> and </html> describes the web page The text between <body> and </body> is the visible page content The biggest font header Headers.. . h6 is the smallest font header Paragraphs <a href="http://www.w3schools.com">This is a link</a> Image Tag. <img src="w3schools.jpg" width="104" height="142" /> Break Horizontal Rule HTML Comment Line Defines bold text Defines italic text

Structure Tags

Function

Start Tag

Attributes none none none Your comments go between the start and end tags. Put a space between the -- and your comments.

End Tag </html> </head> </title> -->

HTML File <html> File Header <head> File Title Comments <title> <!--

Body

<body> background="filename" bgcolor="color value" text="color value" link="color value" vlink="color value" <div> align="right/left/center" style="property:value;" class="classname" style="property:value;" class="classname"

</body>

Division

</div>

Span (inline)

<span>

</span>

Basic Text Tags Function Start Tag Attributes clear="left/right/all" align="center/right" none none none align="center/right" face="name, name" size="+/-value/fixed size" color="color value" Note: the font tag is being phased out in favor of CSS styles. size="XX" width="XX/XX%" noshade End Tag </br> or <br /> </p> </b> </i> </tt> </h1-6> </font>

Line Break <br> Paragraph Bold Italic <p> <b> <i>

Typewriter <tt> Text Headline Font <h1-6> <font>

Horizontal Rule Block Quote Division List Tags Function

<hr>

</hr> or <hr />

<blockquote> none <div> align="left/center/right"

</blockquote> </div>

Start Tag <ul> <ol>

Attributes

End Tag

Unordered List Ordered List

type="disc/circle/square" </ul> type="I/A/1/a/i" start="value to start counting at" </ol>

List Item Definition List

<li> <dl>

type=all ul and ol options </li> none none none </dl> </dt> </dd>

Definition List Item <dt> Definition <dd>

Link Tags

Function Anchor Link Anchor Mark

Start Tag <a> <a>

Attributes href="filename" target="windowname" name="markname"

End Tag </a> </a>

Image Tags Function Insert Image Start Tag <img> Attributes src="filename" align="left/right" width="XXX" height="XXX" alt="text that desribes image" ISMAP USEMAP="#mapname" End Tag </img>

Client-side Imagemap Tags Function Define Map Area Definition Start Tag <map> <area> Attributes name="mapname" shape="rect/circle/poly/point" coords="X,Y,X,Y" href="imagename" End Tag </map> </area>

Table Tags

Function Table

Start Tag <table>

Attributes border="X" width="XX/X%" cellspacing="XX" cellpadding="XX" bgcolor="color value" background="filename" align="left/center/right" valign="top/middle/bottom" bgcolor="color value" align="left/center/right" valign="top/middle/bottom" width=X nowrap colspan="X" rowspan="X" bgcolor="color value" align="left/center/right" valign="top/middle/bottom" width=X nowrap colspan="X" rowspan="X" bgcolor="color value"

End Tag </table>

Table Row

<tr>

</tr>

Table Data

<td>

</td>

Table Header

<th>

</th>

Caption

<caption> align="left/center/right" valign="top/middle/bottom"

</caption>

Style Sheet Tags Function Style Definition Area Link to external CSS File Start Tag Attributes <style> End Tag

type="text/css"> </style> Style declarations go between begin and end style tags rel=stylesheet type="text/css" href="URL" none

<link>

Frame Tags

Function Set Frames Frame Definition

Start Tag <frameset> <frame>

Attributes cols="XX/XX%/*" rows="XX/XX%/*" src="filename" name="framename" noresize scroll=auto/yes/no marginwidth="XX" marginheight="XX" target="framename"/ "_self"/ "_top"/ "_parent" (Note the underscores)

End Tag </frameset> </frame>

Base

<base>

</base>

No Frames

<noframes> Between start and end tags, place the </noframes> content that appears when a non-frames browser loads this page.

Form Tags Function Form Input Field Start Tag <form> <input> Attributes method=get/put action="programname" name="variablename" type=text/password/ checkbox/radio/submit/ reset/image name="variablename" size=XX multiple none name="variablename"
rows=XX cols=XX

End Tag </form> </input>

Selection List

<select>

</select>

Selection Option Scrolling Text Field

<option> <textarea>

</option> </textarea>

Commonly-Used Special Characters Name ampersand cent sign copyright symbol degree sign greater than less than non-breaking space registered trademark trademark Symbol & > < HTML Equivalent &amp; &cent; &copy; or &#169; &deg; &gt; &lt; &nbsp; &#174; &#153;

You might also like