Text Formatting And Alignment
| Start Tag |
End Tag |
Use |
Result |
| <div align="center"> |
</div> |
<div align="center">The text is centered in this
box.</div> |
The text is centered in this box. |
| <b> |
</b> |
<b>This is bold text.</b> |
This is bold text. |
| <i> |
</i> |
<i>This is italic text.</i> |
This is italic text. |
| <address> |
</address> |
<address>This is my address</address> |
This is my address |
| <h2> |
</h2> |
<h2>Chapter1</h2> |
Chapter 1 |
| <font size="2"> |
</font> |
<font size="2">This is font size 2</font> |
This is font size 2 |
| <font color="#006600"> |
</font> |
<font color="#006600">This sentence is green.</font> |
This sentence is green. |
| <u> |
</u> |
This part of <u>the</u> text is underlined. |
This part of the text is underlined. |
| <br> |
Illegal |
Line 1.<br> Line 2. |
Line 1. Line 2. |
| <p> |
Optional |
...end of paragraph 1. <p> Start of paragraph 2... |
...end of paragraph 1.
Start of paragraph 2... |
| Division: |
The division tag can be used to align text, graphics, or tables. It is
used with the align attributes, left (default),
center, and right. |
| Bold: |
The bold tag makes text darker and thicker. |
| Italics: |
The italics makes text italic. A similar tag, <address> also
makes text italic and is generally used to provide contact information a
the end on a page. |
| Headings: |
The heading tag allows you to add headings and sub headings to your
page. The sizes available are 1 through 7, with 1 being the largest.
|
| Font: |
The font tag can be used to change the size, or color. The default
font size is 3 and the default color is black. The sizes available are 1
through 7, with 7 being the largest.
The font color can be changed by using the hexadecimal value of the
red/green/blue combination that makes up the color. You can use the color
name but one weakness of the MS Explorer Browser is that it can only
recognizes a hand full of names, names like deepskyblue would only confuse
it. Click here to see our RGB
Color Chart which will work in all browsers. |
| Underline: |
The underline tag can be used to underline text. Because of possible
confusion with Links it is not implemented on some browsers and has been
depreciated by the W3C in HTML Version 4.0. (In layman terms... "try not
to use it"). |
| Line Break: |
The break tag breaks a line of text and starts a new line. |
| New Paragraph: |
The paragraph tag starts a new paragraph.
|
Nesting Elements To "nest" elements means to put one inside of
another. As an example, you could make text very strongly emphasized by nesting
the <font color> element and the <i> element inside of the <b>
element:
It is <b><font color="red"><i>highly
recommended></i></font></b> that you extinguish smoking
materials before applying hair spray.
This is rendered as:
It is highly recommended that you
extinguish smoking materials before applying hair spray.
Notice the order the start and ending tags are in? When nesting tags, be sure
to close them in the reverse order you opened them in. HTML Validator's are very
good at catching improperly nested elements.
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. The default alignment is left.
- Thickness can be set pixels with the size attribute. Default is 3 pixels.
Here's how <hr width="75%" align="center" size="4">
appears in your browser:
Arranging Text in Lists Lists are used to indent one or more
items or lines of text, on a web page. There are two general types of lists,
ordered and unordered. An ordered list has each item numbered, while an
unordered list uses bullets to indicate each item.
Ordered (Numbered) Lists
Use:
I like all kinds of music. <P> <OL> <LI>Rock And
Roll <LI>Jazz <LI>Classical <LI>Country <LI>Folk </OL>
Results:
I like all kinds of music.
- Rock And Roll
- Jazz
- Classical
- Country
- Folk
Unordered (Bullet) Lists
Use:
My car has these options. <P> <UL> <LI>Anti Lock
Brakes <LI>Air conditioning <LI>CD Player <LI>Leather
Seats <LI>Passenger Airbag <LI>Talking Wife <LI>Power
Locks <LI>Power Seats </UL>
Result:
My car has these options.
- Anti Lock Brakes
- Air conditioning
- CD Player
- Leather Seats
- Passenger Airbag
- Talking Wife
- Power Locks
- Power Seats
You can get fancy when using the Unordered List by changing the bullet style
to disk, square or circle.
Use:
<UL TYPE="disc"> <LI>this creates bullets which are filled
circles </UL>
Result:
- this creates bullets which are filled circles
Use:
<UL TYPE="square"> <LI>this creates bullets which are filled
squares </UL>
Result:
- this creates bullets which are filled squares
Use:
<UL TYPE="circle"> <LI>this creates bullets which may be
either open circles or open squares, depending on the browser </UL>
Result:
- this creates bullets which may be either open circles or open squares,
depending on the browser
|