| Night Train Web Productions HTML Tutor Code / Tag Chart |
||||||||||||||
| Code / Tag | Name | Example | ||||||||||||
| <!-- blah --> | comment | Nothing inside prints. Great for adding comments to yourself about the code, or markers for quick reference. <!-- begin first colum navigation links --> |
||||||||||||
| <a href | anchor | <a href="http://www.yourdomain.com/">Click Here</a> |
||||||||||||
| <a name | anchor | This link; <a href="glossary.shtml#browser">browser</a> goes to the file glossary.shtml directly at the position marked with this code; <a name="browser">Browser</a> (as seen throughout this eBook for the glossary entries) |
||||||||||||
| <a target | anchor | <a href="http://www.yourdomain.com/" target="_windowname">Click Here</a> Opens link in a new browser window by name. Default variables are: target="_blank" simply, a new window target="_self" (same window you are in) target="_parent" (when using frames) target="_top" breaks out of frames When using frames you can name each frame as you wish. |
||||||||||||
| <b> | bold | <b>Boldface</B> type | ||||||||||||
| <body> | body of document | <body>All the content (the body) of your web page goes between these tags</body> | ||||||||||||
| <br> | Forced line break | Forces the line to break exactly where you place this code | ||||||||||||
| <center> | center | |||||||||||||
| <i> | Italicize | <i>Makes the type italic</i> | ||||||||||||
| <embed> | include something in the page | <embed src="yourfile.mid"> will play that sound file when the page loads | ||||||||||||
| <font face> | font face | <font face="Times New Roman">Times New Roman</font> <font face="verdana">Verdana</font> <font face="comic sans ms">Comic Sans MS</font> <font face="arial">Arial</font> | ||||||||||||
| <font size> | font size |
<font size="-2">Font Size -2</font> <font size="1">Font Size 1</font> <font size="2">Font Size 2</font> <font size="3">Font Size 3</font> <font size="4">Font Size 4</font> <font size="5">Font Size 5</font> <font size="6">Font Size 6</font> <font size="7">Font Size 7</font> |
||||||||||||
| <font color> | font color | <font color="#ff0000">Red</font> <font color="#000000">Black</font> <font color="#0000ff">Blue</font> |
||||||||||||
| <h> | heading | <h1>Heading 1</h1> Use h1, h2, h3, h4, h5, h6Heading 1 |
||||||||||||
| <head> | heading of document | <head>This is where your <title>, <meta> tags go</head> Here's an example: <head> <title>Title Goes Here</title> <meta NAME="keywords" CONTENT="key, words"> <meta NAME="description" CONTENT="Description."> </head> |
||||||||||||
| <hr> | horizontal rule | <hr> <hr width="50%"> <hr width="50%" size="2"> <hr width="75%" size="4" noshade> <hr width="25%" size="6" color="#ff0000"> |
||||||||||||
| <html> | HyperText Markup Language | <html> tells the browser that the HTML document begins here </html> tells the browser that the HTML document ends here |
||||||||||||
| <img | image | <img src="/graphics/image.gif" width="60" height="60" border="0" ALT="information about the image that shows when you hover over it"> | ||||||||||||
| <li> | list item | <li type="disc">List item 1 <li type="circle">List item 2 <li type="square">List item 3 Example 1: (View It) <ol type="i"> <li>List item 1 <li>List item 2 <li>List item 3 <li>List item 4 </ol> Example 2: (View It) |
||||||||||||
| <href | link | <a href="http://www.yourdomain.com/">Click Here</A> | ||||||||||||
| <marquee> (Internet Explorer Only) |
scrolling text | <marquee bgcolor="#c0c0c0" loop="-1" scrollamount="2" width="100%">Example Marquee</marquee> |
||||||||||||
| <menu> | menu | <menu> <li type="disc">List item 1 <li type="circle">List item 2 <li type="square">List item 3 </menu> |
||||||||||||
| <meta> | meta | <meta name="description" content="Description of your site"> <meta name="keywords" content="keywords describing your site"> <meta http-equiv="Refresh" content="4;url=http://www.yourdomain.com/"> <meta http-equiv="pragma" content="no-cache"> <meta name="rating" content="General"> <meta name="robots" content="ALL"> <meta name="robots" content="NOINDEX,FOLLOW"> It's easy to use the Meta Tag Creator at HTMLGuide.US Meta Tag Creator |
||||||||||||
| <ol> | ordered list | Example 1: <ol> <li>List item 1<br> <li>List item 2<br> <li>List item 3<br> <li>List item 4<br> </ol> Example 1: (View It) Example 2:
<ol type="a"> |
||||||||||||
| <P> | paragraph | <p>This is just a simple demonstration of how this tag works for paragraphs. Just imagine you are reading a book, which of course, is full of paragraphs on pages.</p> <p>They are set up like this shows in the HTML document. Each paragraph starts off with the paragraph tag and ends with nothing. This is a good code to be aware of for formatting pre typed manuscripts or articles that you may come across. It saves a lot of coding to break lines and end paragraphs done the manual way using the br code. </p> (View It)Attributes: Example 1:<BR> <BR> <P align="left"> This is an example<BR> displaying the use<BR> of the paragraph tag.<BR> <BR> Example 2:<BR> <BR> <P align="right"> This is an example<BR> displaying the use<BR> of the paragraph tag.<BR> <BR> Example 3:<BR> <BR> <P align="center"> This is an example<BR> displaying the use<BR> of the paragraph tag.</p> (View It) |
||||||||||||
| <strong> | strong emphasis | <strong>Example</strong> Example |
||||||||||||
| <table> | table | Example 1: <table border="4" cellpadding="2" cellspacing="2" WIDTH="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> Will look like this:
Example 2: <table border="2" bordercolor="#336699" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> Will look like this:
Example 3: <table cellpadding="2" cellspacing="2" width="100%"> <tr> <td bgcolor="#c0c0c0">Column 1</td> <td bgcolor="#c0c0c0">Column 2</td> </tr> <tr> <td>Row 2</td> <td>Row 2</td> </tr> </table> Will look like this:
|
||||||||||||
| <th> | table header | <table> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr> <td>Row 2</td> <td>Row 2</td> <td>Row 2</td> </tr> <tr> <td>Row 3</td> <td>Row 3</td> <td>Row 3</td> </tr> <tr> <td>Row 4</td> <td>Row 4</td> <td>Row 4</td> </tr> </table> Will look like this:
|
||||||||||||
| <title> | document title | <title>Title of your webpage</title> | ||||||||||||
| <tr> | table row | <table border="2" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> |
||||||||||||
| <u> | underline | <u>Example</u> prints as example | ||||||||||||
| <ul> | Unordered List | Example 1:<br> <br> <ul> <li>List item 1 <li>List item 2 </ul> <br> Example 2:<br> <ul type="disc"> <li>List item 1 <li>List item 2 <ul type="circle"> <li>List item 3 <li>List item 4 </ul> </ul> |
||||||||||||