Tutorial #2

Return to tutorial map Jump to section 2

Forced Line Breaks
4 Things Like A
Postal Address, OK 01234-5678

A Non-breaking Space prevents word-wrap. Try to adjust your browsers width to see how the following words will act as one: Word one and word two

It's bad practice to use non-breaking spaces to indent text. Instead, it is advised to use style rules covered in later tutorials.

There are some entities that will display special characters. The following is a list of some special characters

Tables are used for informtion as well as layout. You can stretch tables to fill the margis, or specify a fixed width, or leave it to be automatically sized to the size of its contents.

Here is a table showing more special characters. You can use unicode values instead of entity names as done in the below table:

Special characters #160-255
X0123456789
16 ¡¢£¤¥¦§¨©
17ª«¬­®¯°±²³
18´µ·¸¹º»¼½
19¾¿ÀÁÂÃÄÅÆÇ
20ÈÉÊËÌÍÎÏÐÑ
21ÒÓÔÕÖרÙÚÛ
22ÜÝÞßàáâãäå
23æçèéêëìíîï
24ðñòóôõö÷øù
25úûüýþÿ

Tutorial #2 Section #2

The pre tag is
used for pre-
formatted text.
Within the pre tag
you don't need to
use HTML for line
breaks. It also
defaults to a
monospace font.
This is a cat tutorial 1

You can have text wrap around an image by using the align attribute of the image tag. For this picture we have set the allign attribute to left which causes the image to float to the left margin and any text will flow around the right.


The text wrap will continue across multiple elements unless a clear attribute is used within the line break tag. Before this paragraph I have used a line break tag in this manner.

An image map allows for links to be embedded within a geographical reigon inside an image. You can define coordinates using a circular, rectangular, or any type of polygon shape as a clickable reigon. In the cat image above, a rectangular area over the nose is a hyperlink to the first tutorials website. The image on that site has the same link to return