introduction

Every Web page you visit is actually just a plain text document, and it tells your Web browser what it wants the Web page to look like. The browser reads these instructions and displays the action-packed page. The instructions are called the source code.


The first thing to remember about tags is that they travel in pairs.

Every time you use a tag you must also close it off with another tag.
Note the slash - / - before the word </blockquote> in the source code, that's what distinguishes a closing tag from an opening tag.

Tags have attributes for instance <bgcolor="red"> where red is the attribute.
attributes nearly always are contained by "quotation marks"

The body - enclosed by <body> and </body> - is where the action is. Every thing that appears on the page is contained within these tags.

to create a link you need to specify an href (Hyperlink REFerence) yahoo mail

it's pretty easy to add a link which goes to someone's email, instead of another web page. justine's email

<body text="#"> sets the font color

<body link="#"> sets the color of links

<body vlink="#"> sets the color of followed links

<body alink="#"> sets the color of links on click >

<font color="#"> changes font color

</font> returns font to default color

<pre>  turns on preformatted text

</pre> turns off preformatted text

Preformatted text differs from regular text in two important ways:

(1) It will appear in a monospaced, or fixed-width font (making it look typewritten), and

(2) it will appear in the browser window exactly as you typed it, including carriage returns and spaces.

so use preformatted text

when you really
care about your
s p a c i n g
and make sure it is turned off when you really don't care about your spacing!

<body background="filename"> sets the background image

Keep in mind that there's no way to prevent a background image from tiling. So if you want to make sure it doesn't, you'll have to make the image wide enough and tall enough to accommodate large monitors.

The background color is specified within the <body> tag at the beginning of your document. So, if you write in your HTML doc <body bgcolor=yellow> guess what?

when you <blockquote> text you are essentially indenting it from both sides instead of letting it run the full browser width.

<br> inserts a line break

In most cases, the paragraph tag, which skips a line before starting a new one - is the best way to divide up your text. However, there may be occasions when you want to end a line of text and start a new one without skipping a line in between. In these cases, it's usually best to insert a line break, using the <br> tag.

i have inserted a linebreak
here

<p align=left>aligns a paragraph to the left

<p align=right> aligns a paragraph to the right

<p align=center> centres a paragraph (note american spelling.)

Adding/Aligning Images
<img src="path and filename"> places an image
<img align=left/right> aligns an image Before you can put an image on a Web page, you need to know the name of the image file and where it's stored on your server. That way you can instruct the browser on how to find the image it needs. The easiest place to save the image is in the same folder or directory as your HTML source file, which is where the browser will automatically look for it. If you have many images to organize, it's common practice to create a folder called "images" then place that folder (or directory) in the same directory as your HTML file. My image is called "newboard.gif," and it's in a folder called "images," which is in the same folder on the server as this HTML file. The HTML for my image will read like this: <img src="images/newboard.gif">

using the image align tag, I can also control where the image is placed on the page. <img align=right src="images/newboard.gif">

centering doesn't reliably work with img <align>.
instead locate the image in a center aligned paragraph like this...

<p align=center> <img src="images/newboard.gif">

There are several techniques for wrapping text around pictures, and they're controlled through the <img align> tags

quick review

<img align=left>   aligns an image to the left side of the page

<img align=right>  aligns an image to the right side of the page

<img align=top>    aligns text along the top of an image

<img align=bottom> aligns text along the bottom of an image

<img align=middle> aligns text to the middle of an image

If you'd like a single line of text to appear next to the image, and the rest to drop below it, you can use the <img align=top>, this image was intended to show a newboard. <img align=middle> and <img align=bottom> tags look like this: this image was intended to show a new board. this image was intended to show a new board.

if you want a very succinct review of any of these items go to webmonkey:html basics