WengerEnterprises
    Simplifying Web Design


Pages

Tools

Webmasters


    Text Styling

In this lesson you will learn how to style text like I have here. Try not to do it too much though, as it gets annoying, as I am sure that this is.

The font tag is the most essential in styling text.

<font color="red">This text is red.</font>

The result is:

This text is red.

There are only a few colors that you can use using this technique. They are: red, blue, yellow, green, purple, teal, orange, grey, and others. Try others. If they don't work, you will have to use hexidecimal numbers. A hexidecimal number is a set of 6 numbers in HTML (different number in other languages) that define a certain color. The first two numbers define red, the second two numbers define green, and the last two define blue.

The numbers tell your browser how much of each color to put in. "00" would be none, while FF would be full. Each space can hold a value of 0-9 and A-F (A-F meaning more than a number). The pound sign (#) comes before the number itself stating that the following is a hexidecimal number. It may be excluded, but it's better to leave it in. Here is a hexidecimal number:

<font color="#FF0000">What color will this be?</font>

Remember that the value of an attribute is contained in quotation marks, and that the pound sign is preceding the number. What color would that be? The first two colors are full. The first two colors are what color?

Red

You can also make text different sizes. All we have to do to change the size is add a size attribute.

<font size="5">Large Text</font>

Large Text

If you want to use a different font, you have to use the "face" attribute:

<font face="Symbol">This is in the Symbol font.</font>

This is in the Symbol font.

Remember how we alligned images to left, center, or right? Well you can do the same thing with text by adding an allignment attribute to the tag.

<p align="right">This is on the right hand side.</p>

This is on the right hand side.

Lots of attributes can be used on different tags. Listing them all in each lesson would be time consuming, so if you think that an attribute should go with the tag you're trying to use, go for it. Chances are that it will be a supported attribute of the tag you are trying to use.

Sometimes you will see <span> used instead of <font>. You use this tag much the same way. Font is used more for large amounts of text, while span is used for smaller areas.

Now for bold, italics, and underline. These tags are extremely simple.

<b>This text is bold.</b> <i>This text is italicized.</i> <u>This text is underlined.</u>

This text is bold. This text is italicized. This text is underlined.

Headings

Different sizes for different needs.

Finally we will discuss headings. You just read two different kinds of headings. Search Engines (like Google and Yahoo) like headings, so it is good to use them. You will learn more about making your website more Search Engine friendly later on. Headings come in six different sizes ranging from 1 to 6.

<h1>This is a large header.</h1> <h6>This is a tiny header.</h6>

This is a large header.

This is a tiny header.

That's pretty much all you need to know about text styling. Your next lesson will be on special items in HTML.




©WengerEnterprises.com - All Rights Reserved

Privacy Policy