Adding Style

Adding Your Own Style

Grammar needs structure and finessing this structure adds style to your writing. HTML makes it easy to add style to your creations. This section will provide you with information on horizontal rules, headings and other text styles.

Horizontal Rules

The <HR> horizontal rule tag creates a line which can be used to break up space on your page. The <HR> horizontal rule tag has three principal attributes:

	Width can be set in pixels or as a percentage with the width attribute. The default width is 100%.
	Alignment can be set to left, right or center with the alignment attribute
	Thickness can be set pixels with the size attribute. Default is 3 pixels.

Headings

The heading tag allows you to add headings and subheadings to your page. The headings tag has six sizes:

This is <H1>

This is <H2>

This is <H3>

This is <H4>

This is <H5>

This is <H6>

Headings can be aligned left, right or center with the align attribute. Left is the default alignment. Here's how <H3 align=center> Center Heading </H3> appears in your browser:

Center Heading

DIV

Use the center align attribute, within the <DIV> tag to center text, graphics, or tables. Here's how <DIV align="center">This is centered text.</DIV> would appear in your browser:

This is centered text.

STRONG

The <STRONG> strong or bold tag makes text darker and thicker. Here's how <STRONG>This is bold text </STRONG> would appear in your browser:

This is bold text

ITALICS

The <I> italics makes text italic. A similar tag, <ADDRESS> also makes text italic and is generally used to provide contact information at the end of a page.
<I>This is italics</I> looks like this...

This is italics

Font

The <FONT> font tag can be used to change the size, or style. The font tag is deprecated (meaning that it is not recommended by the W3C any longer) but it still works in most browsers. The font tag has three main attributes:

	The font size can be changed with the size attribute. The value of this attribute can be an absolute value from 1 to 7 or a relative value to the basefont size. The default base font size is 3. For example, the following both produce a font size of 5: <FONT SIZE="5">This is font size 5 </FONT> This is font size 5 <FONT SIZE="+2">This is also font size 5 </FONT> This is also font size 5
	The font color can be changed with the color attribute. The value of the color attribute can be the RGB color value or one of the standard color names. For example, the following both produce red text: <FONT COLOR="#FF0000">This is red.</FONT> This is red. <FONT COLOR="red"> This is also red.</FONT> This is also red.
	The font style can be changed with the face attribute. <FONT FACE="Comic Sans MS">This is Comic Sans.</FONT> This is Comic Sans. <FONT FACE="Comic Sans MS" COLOR="blue" SIZE="+2">This is Comic Sans, color blue, and font size 2 times bigger than default.</FONT> This is Comic Sans, color blue, and font size 2 times bigger than default.

Nesting Tags

You can also use multiple tags and attributes together to get different effects. When nesting tags, be sure to close the tags in the same order that you opened them.

<font size="+1" color="red"><strong><i>This is fun.</i></strong></font>

This is fun.