Commonly Used HTML Tags
In the HTML tags listed below, items shown in green are HTML tags. While items in blue illustrate actual HTML coding with the results of that coding immediately below it. Unlike URLs, HTML tags may be entered in either upper or lower case (or a combination of upper and lower case).
HTML coding is used in the Article Text portion of your "Add Page" capability and in the HTML Block feature of "Remake Home Page".
| Text Tags center, h1 - h6, bold, italics, font, pre, tt, cite |
Links a mailto |
Formatting p, br, blockquote, ol, ul, li |
Graphical Elements img, hr |
Tables table, tr, td |
| Text Tags Return to Top of Page | |||||||||||||
|
<center></center> Centers a portion of text <center>This text is centered</center> | |||||||||||||
|
<hl></hl> (h and the number one) Creates the largest headline <hl>Biggest Heading</hl> Biggest HeadingPlease note HTML tags can be combined. In this next example the center and the h1 tags are combined. Also, note that the closing HTML tags must be in the opposite order (work from inside out).
Biggest Heading Centered | |||||||||||||
|
<h2></h2> (h and the number two) Creates the next biggest headline. Heading Numbers range from 1 to 6. One is the largest and six is the smallest. <h2>Next Biggest Heading</h2> Next Biggest Heading | |||||||||||||
|
<h6></h6> (h and the number six) Creates the smallest headline <h6>Smallest Heading</h6> Smallest Heading | |||||||||||||
|
<b></b> Creates bold text <b>Bold Print</b> | |||||||||||||
|
<i></i> Creates italic text <i>Italic Print</i> | |||||||||||||
|
<font size=?></font> Sets size of font, from 1 to 7. <font size=3>Example of size=3</font> | |||||||||||||
|
<font color=?></font> Sets font color, using name or hex value. Note that the color and size tags may be set into the same command. <font color=red size=2>Red text size equal 2</font> <font color=#ff0000 size=2>Same using hex color codes</font> | |||||||||||||
|
<pre></pre> Preformatted text - For example the text is displayed the same way it is typed. Sometimes this is used to get text to align in columns. However, the table command (below) is a much better command to use to align text in columns. <pre> This is an example of the pre command. When you use this command type the text exactely as you wish it to appear. Column 1 Column 2 Column 3 item1 item2 item3 item4 item5 item6</pre> | |||||||||||||
|
<tt></tt> Creates teletype, or typewriter-style text <tt>This is an example of teletype text.</tt>
| |||||||||||||
|
<cite></cite> Creates a citation, usually italic <cite>This is an example of a citation.</cite>
| |||||||||||||
| Links Return to Top of Page | |||||||||||||
|
<a href="URL"></a> Creates a hyperlink. The URL can be either of two formats.
A link to <a href="http://www.google.com">google.com</a>.
| |||||||||||||
|
<a href="mailto:EMAIL"></a> Creates a mailto link
| |||||||||||||
| Formatting Return to Top of Page | |||||||||||||
|
<p> Creates a new paragraph. Inserts an extra line feed prior to the beginning of the text. | |||||||||||||
|
<p align=?> Aligns a paragraph to the left, right, or center | |||||||||||||
|
<br> Inserts a line break (line feed). | |||||||||||||
|
<blockquote> </blockquote> Indents text from both sides <blockquote>This is an example of a blockquote.</blockquote>
This is an example of a blockquote. | |||||||||||||
|
<ol></ol> Creates a numbered list | |||||||||||||
|
<ul></ul> Creates a bulleted list | |||||||||||||
|
<li> Precedes each list item, and adds a number Numbered list.
| |||||||||||||
| Graphical Elements Return to Top of Page | |||||||||||||
|
<img src="URL"> Adds an image. Please note the URL is the same format as described in the link HTML command above. | |||||||||||||
|
<img src="URL" align=?> Aligns an image: left, right, center; bottom, top, middle | |||||||||||||
|
<img src="URL" height=? width=?> Aligns an image with the height and width set. Setting the height and width of the image allows the browser to load the page quicker since it knows before hand how much space to allocate to the image. | |||||||||||||
|
<img src="URL" border=?> Sets size of border around an image
Insert the InfoSports logo and have it left aligned with no border and with height and width set.
<img src="/images/logo.gif" height=60 width=312 align=left border=0>
| |||||||||||||
|
<hr> Inserts a horizontal rule | |||||||||||||
|
<hr size=?> Sets size (height) of rule | |||||||||||||
|
<hr width=?> Sets width of rule, in percentage or absolute value | |||||||||||||
|
<hr noshade> Creates a rule without a shadow Insert an unshaded ruler of height 4 and width 300. <hr size=4 noshade width=300> | |||||||||||||
| Tables Return to Top of Page | |||||||||||||
|
<table></table> Creates a table | |||||||||||||
|
<tr></tr> Sets off each row in a table | |||||||||||||
|
<td></td> Sets off each cell in a row | |||||||||||||
|
<th></th> Sets off the table header (a normal cell with bold, centered text) | |||||||||||||
| Table Attributes | |||||||||||||
|
<table border=#> Sets width of border around table cells | |||||||||||||
|
<table cellspacing=#> Sets amount of space between table cells | |||||||||||||
|
<table cellpadding=#> Sets amount of space between a cell's border and its contents | |||||||||||||
|
<table width=# or %> Sets width of table — in pixels or as a percentage of document width | |||||||||||||
|
<tr align=?> or <td align=?> Sets alignment for cell(s) (left, center, or right) | |||||||||||||
|
<tr valign=?> or <td valign=?> Sets vertical alignment for cell(s) (top, middle, or bottom) | |||||||||||||
|
<td colspan=#> Sets number of columns a cell should span | |||||||||||||
|
<td rowspan=#> Sets number of rows a cell should span (default=1) | |||||||||||||
|
<td nowrap> Prevents the lines within a cell from being broken to fit Example table... a simplified portion of the web site feature matrix.
| |||||||||||||
