HTML Tags
HTML tags comprise the backbone of any web-based content, providing the stylistic and functional information that a web browser needs to display the page. While web editors like KompoZer and Dreamweaver as well as the built-in text editor in Edublogs (WordPress) feature a WYSIWYG (What You See is What You Get) editor, it is possible to do a great deal of HTML content creation or adjustment to existing HTML by knowing just a few simple HTML tags.
Below is a table of basic HTML tags. Remember that tags are generally always used in pairs, with the closing tag identical to the opening tag with the exception of including a forward slash to begin the closing tag. For the examples provided below, the opening tag is shown in ALL CAPS with the closing tag in lowercase. Tags are not case sensitive, but typically only lowercase tags are used.
| Tag: | Description: |
| <HTML></html> | Tags used at the beginning and end of every document |
| <HEAD><TITLE>docname.html</title></head> | Start and ends document information: title of page. Does not show in browser. |
| <BODY></body> | Starts and ends body of document. Documents have ONE body tag; all background and link color info. goes in this one tag. <BODY bgcolor=”#ffffff”> for a solid white background <BODY background=”beige.gif”> uses an image file for a background. As with any image reference, the image must be in the same directory as the HTML file. |
| <LINK=”#xxxxxx”> <ALINK=”#xxxxxx”> <VLINK=”#xxxxxx”> |
Link color can be changed by placing these tags within the <BODY> tag, along with any background information. |
| <H1>Title of Document</h1> | Enlarges text and places space around it. Varies in size from H1 to H6, with each getting progressively smaller. |
| <A HREF=”http://…”>text</a> |
Links text to a particular web document. (external link) |
| <A HREF=”#textname”>text</a> | Works with a target or name tag to link to text within the same web page. (internal link) |
| <A NAME=”textname”>text</a> | Target or name tag used for internal (aka “anchor”) link. |
| <IMG SRC=”http://www…/pix.gif”> | Places the selected image in document. No ending tag needed. |
| <A HREF=”mailto:me@global.uillinois.edu”></a> |
Creates an email link |
| <FONT SIZE=+1>text</font> <FONT COLOR=”#ff00ff”>text</font> |
Enlarges text from +1 to +7 Changes color of font between tags. |
| <HR> | Horizontal rule: places a line across page. No need for an end tag. Images may also be inserted as horizontal rules. |
| <BR> | Line break |
| <P>paragraph text</p> | Paragraph break. Double spaces before next text. |
| <CENTER>text</center> | Centers text horizontally |
| <B>bold</b> | Makes text bold |
| <I>italic</i> | Makes text italic |
| <UL><LI></ul> | Unordered, bulleted list. The <LI> tag marks each bulleted item |
| <OL><LI></ol> | Ordered lists where list items <LI> are numbered |
| <BLOCKQUOTE>text</BLOCKQUOTE> | Indents text |
For those experienced with HTML, what are some other basic HTML tags that you’ve found to be helpful that I should consider adding to this list?