HTML Tags

When entering HTML tags it doesn't matter if you use upper or lower case. The only place that case matter is when you are entering something in quotes such as web address.

Here are some common commands:


To create a link use the following tags: <A HREF="http://www.somewhere.edu/">Somewhere</A> In place of www.somewhere.edu you may put whatever web address you wish. What ever appear between the openning < HREF = "..."> and the closing tag </a> will be what the viewer can click on to go to the web address that you have specified. That means you can place text and images in between those two tags to make them links which the viewer can click on.

If the file you want to link to is also in your account you can just put the name of the file in place of the full web address. For example:

<A HREF="../519/howto/NameofFile.html"> will work the same as </a><A HREF="http://www.calpoly.edu/~yourloginname/NameofFile.html">
To create a link for someone to send you mail use the following tags: </b></a><b><A HREF="mailto:YourAddress@calpoly.edu">Send me mail!</A> This is the same as the link command shown above, but in place of the web address you put "mail to:" and your e-mail address in quotes.
To set a background color simply write: <background="color-name"> Where is says "color-name" enter a common color name. This makes the color of the page whatever color you choose. You can use "light" or "dark" to make different shades of the color. For example: <BACKGROUND="lightblue"> The background will now be blue. Also, you can make your background a picture by entering a file name for the image in your account. For example: <BACKGROUND="animage.gif" > /xmp></b> <hr> To create a new line enter: <b><xmp> <BR> No end tag or command is needed to end the new line.
Here are two ways to center your text: <P ALIGN=CENTER> Enter your text block to be centered in between the tags </P> <CENTER> Enter whatever you wish to center in between the tags This can include image tags if you wish to center a picture </CENTER>
To Make a separater bar between text or at the beginning or end or a page enter: <HR> No end tag or command is needed to end the separater bar.
To create different size headings (sizes 1 through 6) use the following heading commands:

Source

Result

<H1>Heading Text Here</H1>

Heading Text Here

</b><H2><b>Heading Text Here

Heading Text Here

</b><H3><b>Heading Text Here

Heading Text Here

</b><H4><b>Heading Text Here

Heading Text Here

</b><H5><b>Heading Text Here
Heading Text Here
</b><H6><b>Heading Text Here
Heading Text Here

To create different sized fonts enter: <FONT SIZE=1>Enter all text to be this size here</Font> Size 1 is the smallest size font and 8 is the largest size font. If you do not specify a size font then your text will be whatever the default size font is set for on your computer.
To create a font color enter "font color=" and specify which color you want to use inside your font tag. For example: <FONT COLOR="darkblue">Enter all text to be dark blue here</FONT> will appear like this:

Enter all text to be dark blue here


To display an image use the following tag: <IMG SRC="../519/howto/picture.gif"> Save your images either as a "gif" file or a "jpeg" file. These files work best for webpage images.
To start a new paragraph enter: <P>Enter all information here</P> This should to be done for every new paragraph if you want spacing between paragraphs.
To make lists refer to the following:

Normal List

Source

Results

<UL> <LI>Bulleted item 1 <LI>Bulleted item 2 <LI>Bulleted item 3 </UL>
  • Bulleted item 1
  • Bulleted item 2
  • Bulleted item 3

Numbered List

Source

Results

<OL> <LI>Numbered item 1 <LI>Numbered item 2 <LI>Numbered item 3 </OL>
  1. Numbered item 1
  2. Numbered item 2
  3. Numbered item 3

To create a bold item enter: <B>Enter text here</B>
To italize text enter: <I>Enter text here</I>
To underline text enter: <U>Enter text here</U>
You can also learn new commands by checking out how a website was created! When you are viewing the website click "View" menu and select "Source" or "Document Source". This will display the commands that are used to display the page you are viewing! This is a great way to learn new webpage tricks and commands.

You can also go to our links page to find websites with more information.

Back