Scribd
Upload
25 views7 pages

Lesson1 HTM

Uploaded by

fouzianawaz1997
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
25 views7 pages

Lesson1 HTM

Uploaded by

fouzianawaz1997
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

Welcome to Lesson 1! Modifying existing web pages does not have to be difficult.

There is no need to learn the entire HTML programming language as this tutorial is
designed to provide a general understanding of the codes. In this lesson the
following basic definitions and relevant tags are discussed:

What is HTML?
What are Tags?
Explanation of Document Structure
Explanation of Document Structure Tags

What is HTML?
HTML (Hyper Text Markup Language) is the language used to write Web pages
which consists of codes (tags) embedded in the text of a document.

What are Tags?


Tags are codes in an HTML document which the browser reads and then interprets
for subsequent display to a reader. Tags are not visible when an HTML document is
viewed in a browser, but their effects are. Tags begin with the opening symbol "<"
and end with the closing symbol ">"; and usually come in pairs, one that begins an
action and one that ends it.
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
Below is an example of an HTML tag and its respective browser display:

HTML Code Browser Display

I want to <B> emphasize </B>


I want to emphasize this!
this!

* Do not worry about memorizing all the tags described in these lessons. Any tags
that are required are listed in the accompanying HTML Reference Guide which can
be printed for reference purposes.

Explanation of Document Structure


Each HTML document has a minimum number of tags. Here is the very least HTML
code that can be called a "page":

<HTML>

<HEAD>
<TITLE>This is my page Title!</TITLE>
</HEAD>

<BODY>

This is my message to the world!

</BODY>

</HTML>

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
NOTE: HTML is not case sensitive. <title> is equivalent to <TITLE> or <TiTlE>.

Explanation of Document Structure Tags

<HTML>...</HTML> Encloses the entire HTML document.These


tags let the browser know to start reading
and displaying the information presented
within.

<HEAD>...</HEAD> The <HEAD> element contains all information


about the document in general. It contains
HTML elements that describe the document's
usage and relationship with other documents.

<TITLE>...</TITLE> The <TITLE> is contained in the <HEAD> of


the document. It is displayed at the top of
the browser window and on the bookmark list,
so it is important to choose something
descriptive, unique, and relatively short.

<BODY>...</BODY> The <BODY> element contains all the


information which is part of the document.

There are a number of different attributes for


the <BODY> tag (attributes are the elements
included within brackets that change the
behavior or appearance of a tag). They are:

"BACKGROUND=" Specifies the image tile that


open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
is to appear in the document's background.

EXAMPLE:

<BODY BACKGROUND=
"picturename.gif">
</BODY>

"BGCOLOR=" Sets the background color of the


page. In order to do this a six digit
hexadecimal number denoting a red-green-
blue color value is included. Thus "000000" is
black and "FFFFFF" is white and every other
colour in between is described using these 6
characters in different combination. In
addition to the hexadecimal system, there are
sixteen color names that (other than black)
that can be included in the tags. They are:
Aqua, Red, Green, Blue, Violet, Fuchsia, Gray,
Lime, Maroon, Navy, Olive, Purple, Silver,
Teal, White, and Yellow.

EXAMPLE:

<BODY
BGCOLOR="#FFFFFF">
This page has a white
background.
</BODY>

OR

EXAMPLE:

<BODY
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
BGCOLOR="WHITE">
This page has a white
background.
</BODY>

"LINK=" Sets the hexadecimal color code for


links that have not yet been visited.

EXAMPLE:

<BODY
LINK="#0C6249">
This page has blue
links
</BODY>

VLINK= Sets the hexadecimal color code for


links the user has already visited.

EXAMPLE:

<BODY
VLINK="#800080">
This page has purple
links after being
visited
</BODY>

"ALINK=" Sets color of links that are active


(ie., the color they turn when the link is
clicked on).

EXAMPLE:

<BODY
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
ALINK="#FFB50C">
This page has yellow
active links
</BODY>

"TEXT=" Sets the hexadecimal color code for


the default text color.

EXAMPLE:

<BODY
TEXT="#00006A">
This page has blue
text
</BODY>

The <BODY> tags for this document are as


follows:

<BODY BACKGROUND="spiral_ruled.gif"
BGCOLOR="#FFFFFF" TEXT="#00006A"
LINK="#005A5A" VLINK="800080"
ALINK="#FFB50C">

An excellent way to learn HTML is to view the coding used on other web pages. To
do this in either Netscape or Internet Explorer - select "View Source" from the
"View" menu. The file contents with all the HTML tags will be displayed in a new
window.

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
Try it out!
In the Box below, type the following HTML code, then click the "View" button. The
HTML document you made will be displayed in a new browser window. You may
wish to experiment by changing the words within the tags.

Try typing this:

<HTML>

<HEAD>
<TITLE>My first Web page</TITLE>
</HEAD>

<BODY BGCOLOR="#800080" TEXT="#FFFFFF">


Type a message here.
</BODY>

</HTML>

`ˆÌi`ÊÜˆÌ ÊÌ iÊ`i“œÊÛiÀȜ˜ÊœvÊ
˜vˆÝÊ*ÀœÊ* Ê `ˆÌœÀÊ
View Erase
/œÊÀi“œÛiÊÌ ˆÃʘœÌˆVi]ÊۈÈÌ\Ê
ÜÜÜ°ˆVi˜ˆ°Vœ“É՘œVŽ° ̓
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

You might also like