'P.G. Department of Computer Science (Shift - II)

WEB_PROGRAMMING_UNIT_I_HTML
`P.G. Department of Computer Science (Shift – II)

(B.Sc COMPUTER SCIENCE)
E-Content
Subject : WEB PROGRAMMING USING PHP AND MYSQL

Class : III BSc COMPUTER SCIENCE
Unit : I(HTML)
Assistant Professor : H.RIAZ AHAMED
Prepared by H.Riaz Ahamed, Asst. Professor, Dept. of Computer Science, The New College, Chennai-14.
Unit-I:
Introduction to HTML: Structure of HTML Program- Text Formatting Tags – List –
Image – Table – Colors – Links – Internal and External document Interface – Frames –
Frame set- Hyper Link.
1. Introduction to HTML
Software information is very dynamic and it keeps changing and re-changing all the time. To resolve this,
information needs to be stored in such a manner that whenever the information changes, these changes can be
incorporated with the least cost and time. It can be stored in the form of computer based files at a central
location. Once the file is stored, it can be referenced when required. The files on the central location can be
accessed via networks which connects two or more computers.
1.1 Client Server Terminologies:
Client: A computer requesting for information is termed as client.
Server: The Computer serving information from a central location is termed as the Server.
Web pages: The information which internet carries from a server to a client that requests them.
Web developer: The individual who develops web pages are called a web developer.
Web Server: The Server computer which runs special software is called a Web Server. It allows
o Web Site Management

o Accept a Client’s request for information.
o Respond to a client’s request by providing the page with required information.
Example for Web Server: Internet Information Server (IIS), Apache Web Server, Netscape Server, Microsoft
Personal Web Server.
Web Client: Computers that offer the facility to read information stored in web pages are called Web Clients.
Web Browser: Web Clients run special software called a Web browser. It allows
o Connect to an appropriate Server.

o Query the Server for information.
o Provide the interface to read the information returned by the Server.
Example for Web Browser: Netscape Navigator, Internet Explorer, Google Chrome.
1.2 Browser Communication with a Web Server

A Web Server is responsible for sending web pages to a Web Browser on a client. When a browser
communicates with a web server. When a Browser communicates with a Web Server, it results into a four step
HTTP transaction.
1.2.1 Establish Connection:

TCP/IP is used to computers establish a link between a Web Server and a Web browser over the internet.
To communicate with the web Server, the client machine must be given the IP address of the Server along with
the sub protocol that must be used .i.e. HTTP, FTP etc.
The Client browser will attempt to locate the server based on the IP address supplied and establish a connection.
1. Connect
2. Request
3. Reply
4. Close
Each of the protocols (like HTTP, FTP) can be accessed by specifying protocol name and a specifying “port
number”. Example: 80 for HTTP and 21 for FTP.
If the protocols are configured on default port numbers, the connection to a Web Server can be established by:
Protocol://IP address
Example: http://131.100.2.107
1.2.2 Client issues a request and Server sends a response:

Each Web Server controls a web site. From amongst the collection of several web pages, one page is treated as
a “Default Web Document”.
When a web browser connects to a Web Server using an appropriate protocol name, IP address and port
number, and the Web Server treats this connection to be a request for the “Default Web Document”.
A Web page apart from text and HTML tags, can also include references to objects like GIF’s, JPEG ‘s , Audio
files and video files and so on.
The Web server try to locate the web page requested, and if the page exists, the server responds by providing
the page to the browser. If the Web page is not found, an appropriate Error message is sent as a response to the
browser request.
After receiving the Web page, the Browser will identify the external objects that are specified in the web page if
any and request the Server to deliver the external objects.
1.2.3 Server terminates the Connection:

It is the Server’s responsibility to terminate the TCP/IP connection with the Browser after it responds to the
Browser’s request.
1.3 Hyper Text Markup Language (HTML)
The language used to develop web pages is called Hypertext Markup Language (HTML).HTML is the language
interpreted by a browser. Web pages are called HTML documents. HTML is specified as Tags in an HTML
document.
1.3.1 HTML tags

Tags are instructions that are embedded directly into the text of the document. It signals browser to do
something other than just throw text up on the screen. By Convention all HTML tags begin with an open angle
bracket (<) and end with a close angle bracket (>).
Types of HTML tags:

HTML tags can be of two types.
Paired Tags
A tag is said to be a paired tag if it comes along with a companion tag, flanks the text. The effect of the paired
tag is applied only to the text they contain. The first tag is often called as the opening tag which activates the
effect and the second tag is called as the closing tag which turns the effect off.
Example: The <B> tag with its companion tag </B> causes the text contained between to be rendered in bold.
Singular tag
The second type of tag is the singular or stand alone tag. A stand alone tag does not have a companion tag.
Example: <BR> tag will insert a line break. This tag does not have a companion tag.
1.3.2 The Structure of an HTML Program
Every HTML program has a rigid structure. The entire web page is enclosed within <HTML> </HTML> tags.
Within these tags, two distinct sections are created using the <HEAD> </HEAD> tags and the <BODY>
</BODY> tags.
Document Head
Information placed in this section is essential to the inner workings of the document and has nothing to do with
the content of the document.
With the exception of information contained within the<TITLE> </ TITLE> tags, all information placed within
the <HEAD> </HEAD> tags is not displayed in the browser.
The syntax of <HEAD> tag is of the form:
<HEAD>
. <TITLE> </TITLE>
.
</HEAD>
Document Body
The syntax of <BODY> tag is of the form:
<BODY>
.
.
</BODY>
Attributes of <BODY> tag:

Page defaults like background color, text color, font size, font weight and so on can be specified as attributes of
the <BODY> tag.
The attributes that <BODY> tag takes are BGCOLOR, BACKGROUND and TEXT
BGCOLOR: Changes the default background color to the specified color.

BACKGROUND: Specifies the name of the gif file used as background.
TEXT: Changes the default text color to the specified color.
Example: < BODY BACKGROUND=“star.gif” TEXT= red>
TITLES AND FOOTERS
TITLE
The <TITLE> tag defines the title of the document and it is displayed in the title bar of the web page.
The Syntax of <TITLE> tag is of the form:
<TITLE>SOME TEXT </TITLE>
Example: <TITLE>THE NEW COLLEGE </TITLE>
FOOTER
Copyright information, contact details of the creator and so on are the type of information kept at the foot of the
web page. The <ADDRESS> tag is used for placing this information in the web page.
The Syntax of <ADDRESS> tag is of the form:

<ADDRESS>SOME TEXT </ADDRESS>
Example: <ADDRESS>THIS IS THE FOOTER </ADDRESS>
1.3.3 Text Formatting Tags
Paragraph Breaks
The <P> tag moves onto a new line, skipping one line between the previous line and the new line.
Example
tag is applied only to the text they contain. <p> The first tag is often called as the opening tag which activates
the effect and the second tag is called as the closing tag which turns the effect off.
Output
tag is applied only to the text they contain.
In paired tag, the first tag is often called as the opening tag which activates the effect and the second tag is
called as the closing tag which turns the effect off.
Line Breaks
When text needs to start from a new line and not continue on the same line(without skipping a new line), the
<BR> tag is used. This tag simply jumps to the start of the next line.
Example
Department of Computer Science, <BR>The New College, <BR> Royapettah, <BR> Chennai-14.
Output:
Department of Computer Science,
The New College,

Royapettah,
Chennai-14.
1.3.4 Emphasizing Material in a Web Page

HTML provides certain HEADING STYLES and HORIZONTAL RULES, which helps break text into logical
sections with visual appeal.
(i) Heading Styles

HTML supports six different levels of headings. The highest level header format is <H1> and the lowest level is
<H6>. All the styles appear in BOLDFACE and the size of the heading depends on the level chosen, i.e. <H1>
to <H6>.
Example:
<H3> The New College<H3>
Output: The New College
(ii) Drawing Lines

The tag <HR> draws lines and horizontal rules. This tag draws a horizontal line across the whole page,
wherever specified.
The attributes to the <HR> tag are
(i) ALIGN: Aligns the line on the browser screen, which is by default, aligned to the center of the screen.
ALIGN= LEFT will align the line to the left of the screen.
ALIGN= RIGHT will align the line to the right of the screen.
ALIGN=CENTER will align the line to the center of the screen.
(ii) SIZE: Changes the size of the rule.
(iii) WIDTH: Sets the width of the rule.
Example: Welcome to the New College

<HR ALIGN=LEFT WIDTH=10 SIZE=4>
Output:
Welcome to the New College
1.3.5 Text Styles
(i) Bold: Displays text in BOLDFACE style. The tags used are <B>……</B>
Example: <B>The New College</B>

(ii) Italics: Displays text in ITALICS style. The tags used are <I>……</I>
Example: <I>The New College</I>

(iii) Underline: Displays text Underlined. The tags used are <U>……</U>
Example: <U>The New College</U>

1.3.6 Text Effects
(i) Centering: <CENTER>……..</CENTER> tags are used to center everything found between them- text,
Lists, images, rules, tables or any other page element.
<CENTER>The New College</CENTER>
(ii) Spacing: The tag used for inserting blank spaces in an html document is <SPACER>.This tag is understood
only by browser Netscape.
Its attributes are type and size.
(a) TYPE: To specify whether space has to be left horizontally or vertically.
TYPE=“HORIZONTAL” indicates that horizontal space has to be left.

TYPE=“VERTICAL” indicates that vertical space has to be left.
(ib) Size: Indicates the amount of space has to be left.
Example: The New College

<SPACER TYPE="HORIZONTAL” SIZE=90> Welcome to all
Output:
The New College
Welcome to all
1.4 Colors
Controlling Font Size and Color

All text specified within the tags <FONT> and</FONT> will appear in the font, size and color as specified as
attributes of the tag <FONT>.
Its attributes are:
(i) FACE: Sets the font to the specified font name.

(ii) SIZE: sets the size of the text. It can be 0 to 7.Default is 3.
(iii) COLOR: Sets the Color of the text.
Example:
<FONT FACE=“Comic Sans MS” SIZE=6 COLOR=RED>
The New College
</FONT>
1.5 List
HTML Lists are used to specify lists of information. All lists may contain one or more list elements.
Types of Lists
There are three different types of HTML lists:
1. Unordered List or Numbered List (ul)

2. Ordered List or Bulleted List (ol)
3. Description List or Definition List (dl)
1. Unordered Lists (Bullets)

An unordered list starts with tag <UL> and ends with </UL> tag. Each List item starts with <LI>.
The attributes that can be specified with <LI> are
TYPE: Specifies the type of the bullet.

TYPE=FILLROUND will give a solid round black bullet.
TYPE=SQUARE will give a solid square black bullet.
Example: Some of these products include

<UL TYPE=FILLROUND>
<LI>Floppies
<LI>Hard Disks
<LI> Monitors
</UL>
Output:
Some of these products include
 Floppies
 Hard Disks
 Monitors
2. Ordered Lists (Numbering)

An ordered list starts with tag <OL> and ends with </OL> tag. Each List item starts with <LI>.
The attributes that can be specified with <LI> are
(i) TYPE: Controls the numbering scheme to be used.

TYPE= “I” will give counting numbers (1, 2 …)
TYPE= “A” will give counting Uppercase letters (A, B …)
TYPE= “a” will give counting Uppercase letters (a, b …)
TYPE= “I” will give counting Uppercase Roman letters (I, II …)
TYPE= “i” will give counting Uppercase Roman letters (i, ii …)
(ii) START: Alters the numbering sequence. Can be set to any numeric value.
(iii) VALUE: Changes the numbering sequence in the middle of an ordered list. It is to be specified with the
<LI> tag.
Example: Some of these products include

<OL TYPE=“1” START=3>
<LI>Floppies
<LI>Hard Disks
<LI> Monitors
</OL>
Output:
Some of these products include
3. Floppies
4. Hard Disks
5. Monitors
3. Definition Lists
Definition list values appear within tags <DL> and </DL>. Definition lists consists of two parts.
Definition term: appears after the tag <DT>

Definition description: appears after the tag <DD>
Example:
<DL>
<DT> Keyboard
<DD> An input device
<DT> Printer
<DD> An output device
</DL>
Output:
Keyboard
An input device
Printer
An output device
1.6 IMAGE
HTML allows placing of static and/or animated pages in an HTML page.HTML accepts two pictures file
formats .gif and .jpg.
Images can be inserted into a webpage using the <img> which takes the name of the image file (filename.gif,
filename.jpg, filename.jpeg). HTML also allows control of the height, width, border and so on, of every image
placed on the web page.
The <img> tag takes the following attributes.
(i) ALIGN: Controls alignment of the text following the image. It can be top, middle or bottom. It indicates the
text after the image to be written at top, middle or bottom. It also controls the alignment of the image with
respect to the screen. It can be left, center or right.
(ii) BORDER: Specifies the size of the border to place around the image.
(iii) WIDTH: Specifies the width of the image in pixels.
(iv) HEIGHT: Specifies the height of the image in pixels.
(v) HSPACE: Indicates the amount of space to the left and right of the image.
(vi) VSPACE: Indicates the amount of space to the top and bottom of the image.
(vii) ALT: Indicates the text to be displayed in case the browser is unable to display the image specified in the
SRC attribute.
Example:
<h2>Beautiful Flower</h2>
<img src="image1.jpg" alt="Beautiful Flower" border=1 HSPACE=200 ALIGN=CENTER WIDTH=200
HEIGHT=200 >
Output:
Beautiful Flower
1.7 Tables
A table is a two dimensional matrix, consisting of rows and columns. Tables are intended for displaying data in
columns on a web page. All table related tags are included between the <TABLE> </TABLE> tags. Each row
of a table is described between the <TR> </TR> tags. Each column of a table is described between the <TD>
</TD> tags.
Table rows can be of two types:
(i) Header rows: A row that spans across columns of a table. It is defined using <TH> </TH> tags. The content
of a header row is automatically centered and appears in boldface.
(ii) Data rows: Individual data cells placed in the horizontal plane creates a data row. There could be a single
data cell or multiple data cells.
The attributes of the <TABLE> tag are:
(i) ALIGN: Horizontal alignment is controlled by the ALIGN attribute. It can be set to LEFT, CENTER, or
RIGHT.
(ii) VALIGN: Controls the vertical alignment of cell contents. It accepts the values TOP, MIDDLE or
BOTTOM.
(iii) WIDTH: Sets the WIDTH to a specific number of pixels.
(iv) BORDER: Controls the border to be placed around the table.
(v) CELLPADDING: Controls the distance between the data in a cell and the boundaries of the cell.
(vi) CELLSPACING: Controls the space between adjacent cells.
(vii) COLSPAN: This attribute inside a <TH> or <TD> tag instructs the browser to make the cell defined by
the tag to take up more than one column.
(viii) ROWSPAN: Same as COLUMN except it take up more than one row.
The Caption Tag: Table Headings are called Captions. Captions can be provided into a table using the
<CAPTION> </CAPTION> TAGS. It contains an attribute called ALIGN which controls the placing of caption
either by TOP or BOTTOM.
Example 1: Table using CELLPADDING and CELLSPACING Attributes
<HTML>
<HEAD> <TITLE> TABLE ATTRIBUTE </TITLE> </HEAD>
<BODY BGCOLOR= LIGHTGREY>
<B> TABLE ATTIBUTES</B><BR><BR><BR><BR>
<CENTER>
<TABLE BORDER=5 WIDTH=50% CELLSPACING=10 CELLPADDING=10>
<CAPTION ALIGN=BOTTOM>
<B> SUBJECT CODES </B>
</CAPTION>
<TR> <TH> SUBJECT CODE </TH>
<TH> SUBJECT TITLE </TH>
</TR>
<TR> <TD> 20BJM505 </TD
<TD> WEB PROGRAMMING USING PHP AND MYSQL</TD>
</TR>
<TR> <TD> 20BJMP505 </TD
<TD> WEB PROGRAMMING USING PHP AND MYSQL - LAB</TD>
</TR>
</TABLE>
</CENTER>
</BODY>
</HTML>
OUTPUT:
TABLE ATTIBUTES
SUBJECT CODE SUBJECT TITLE
20BJM505 WEB PROGRAMMING USING PHP AND MYSQL
20BJMP505 WEB PROGRAMMING USING PHP AND MYSQL - LAB
SUBJECT CODES
Example 2: Table using COLSPAN and ROWSPAN Attributes
<HTML>
<HEAD>
<TITLE> TABLE ATTRIBUTE </TITLE>
</HEAD>
<BODY BGCOLOR= LIGHTGREY>
<B> TABLE ATTIBUTES</B>

<BR><BR><BR><BR>
<CENTER>
<TABLE BORDER=5 WIDTH=50% >
<CAPTION ALIGN=BOTTOM>
<B> SUBJECT CODES </B>
</CAPTION>
<TR> <TH ROWSPAN=2> REGNO
<TH COLSPAN=2> PHP MARKS
</TR>
<TR> <TH> PHP THEORY
<TH> PHP LAB
</TR>
<TR> <TD> 8001
<TD> 70
<TD> 90
</TR>
<TR> <TD> 8002
<TD> 80
<TD> 100
</TR>
</TABLE>
</CENTER>
</BODY>
</HTML>
OUTPUT:
TABLE ATTRIBUTES
PHP MARKS
REGNO
PHP THEORY PHP LAB
8001 70 90
8002 80 100
SUBJECT CODES
1.8 Links
HTML allows linking to other HTML documents as well as images. Clicking on a section of text or an image in
one web page will open an entire web page or an image. The text or an image that provides such linkages is
called Hypertext, a Hyperlink or a Hotspot.
The browser distinguishes Hyperlink from normal text. Every hyperlink appears blue in color, and underlined.
To change link colors, there are 3 attributes that can be specified along with <BODY> tag. They are
(i) LINK: Changes the default color to a specified color. It can be a color name or a hexadecimal number.
(ii) ALINK: Changes the default color of a Hyperlink that is activated to a specified color. It can be a color
name or a hexadecimal number.
(ii) VLINK: Changes the default color of a Hyperlink that is already visited to a specified color. It can be a
color name or a hexadecimal number.
Links are created in a web page by using the <A> </A> tags. Anything written between the <A> </A> tags
becomes a hyperlink/ hotspot.
The HREF attribute

The document to be navigated to needs to be specified. By using the HREF attribute of the <A> tag the next
navigable webpage or an image can be specified.
Syntax:
<A HREF=“filename.html”>
1.8.1 Types of Hyperlinks

Hyperlinks can be of two types.
(i) Links to an external document i.e. external document reference

(ii) Links to a specific place within the same document. i.e. internal document reference
External Document References

A hyperlink takes a user to the beginning of a new webpage. At times, it might be necessary to jump to a
particular location within the new webpage. To enable a jump to a specific location on a web page named
anchors can be set up. Anchors target hyperlinks to a specific point on a web page.
Jumping to a particular location on a web page can be summarized in two steps.
Step 1: Name the location to be jumped using the NAME attribute of the <A> tag.
Syntax: <A NAME=“location name”>

Example: <A NAME=“point1”>
Step 2: The web page to jump requires a filename.htm along with the name of the location.
Syntax: <A HREF=“filename.html #location name”>………. </A>
Example: <a href=“https://www.google.com“> Click here </a>
Example Program:
<html>
<head>
<title> External Linking </title>
</head>
<body>
This is the home page. To go to the google page, please
<a href=“https://www.google.com“> click here</a>
</body>
</html>
Internal Document References

Sometimes, a jump is required to a different location in the same document. Since the jump has to be targeted to
a specific location, two steps are needed to perform.
Step 1: Identify a location with a name using the NAME attribute of the <A> tag.
Syntax: <A NAME=“location name”>

Example: <A NAME=“point1”>
Step 2: Jump to that location using the name.
Syntax: <A HREF=“#location name”>………. </A>
Here, filename.html is not needed as the location is in the same document.
Example Program:
<! DOCTYPE html>
<html>
<head>
<title> Internal link example </title>
</head>
<body>
<p>Welcome to my web-page. This is an example of internal link creation in html web-page.</p><br>
<a name= “HTML Introduction”> Introduction to Html </a>
<p> Html is hyper text mark-up language.</p><br><br>
<a name= “CSS Introduction”> Introduction to CSS </a>
<p> Cascading Style Sheet is used for styling the web pages</p><br><br>
<a href= “#HTML Introduction”> html</a><br>
<a href= “#CSS Introduction”> css</a>
</body>
</html>
Images As Hyperlinks
An image can act as hyperlinks just like text. An image can be made a hyperlink by enclosing an <img> tag
within the <A> </A> tags. The <img> tag places the image on the screen because it is enclosed within the <A>
</A> tags, it becomes a hyperlink.
Syntax:
<a href="https://filename.html/">
<img src="imagefile" alt="Alt name">
</a>
Example Program:
<html>
<body>
<h2>Image as a Link</h2>
<p>The image is a link to The New College.</p>
<a href="https://thenewcollege.edu.in/">
<img src="smiley.gif" alt="The New College">
</a>
</body>
</html>
1.9 Frames
The HTML frame is a powerful feature that enables a web page to be broken into different unique sections that,
although related, operate independently of each other.
The <FRAMESET> Tag

The splitting of a browser screen into frames is accomplished with the <FRAMESET> and </FRAMESET>
tags embedded into the HTML document.
The attributes of <FRAMESET> tags are
(i) ROWS: This attribute is used to divide the screen into multiple rows. The values can be number of pixels or
percentage. The remaining space is indicated by *.
(ii) COLS: This attribute is used to divide the screen into multiple columns. The values can be number of pixels
or percentage. The remaining space is indicated by *.
The <FRAME> tag:
Once the browser screen is divided into rows and columns, each unique section defined can be loaded with
different HTML documents.
The attributes of <FRAME> tags are

(i) SRC=“url” – Indicates the URL of the document to be loaded into the frame.
(ii)MARGINHEIGHT=“n”- Specifies the amount of white space to be left at the top and bottom of the frame.
(iii)MARGINWIDTH=“n”- Specifies the amount of white space to be left along the sides of the frame.
(iv) NAME="n" – Gives the frame a unique name so it can be targeted by other documents.
(v) NORESIZE – Disables the frames resizing capability.
(vi) SCROLLING – Controls the appearance of horizontal and vertical scrollbars in a frame.
Example:
<FRAMESET ROWS="30 %,*">
<FRAMESET COLS="50%, 50 %">
<FRAME SRC="file1.htm">
</FRAMESET>
<FRAMESET COLS="50%, 50 %">
</FRAMESET>
</FRAMESET>
Hyperlinks in Frames:
Whenever a hyperlink, which loads a document in a frame, is created, the file referenced in the hyperlink will
be opened and will replace the current document that is in the frame.
In a situation where the new document needs to be opened in a different frame while keeping the document
from which the new document was navigated open in a different frame, a simple HTML coding technique must
be used.
Since the hyperlink must open an HTML file in another frame, the frame in which the HTML file is to be
opened needs to be named. This is done by using the NAME attribute of the <FRAME> </FRAME> Tags. The
NAME takes one parameter, which is its frame name.
The hyperlink tag will have to be supplied with the following information
1. The filename.html file that has to be opened (navigated to).
2. The name of the frame where the filename.HTML file has to be opened.
The attribute via which the frame name is specified is the TARGET attribute, which is a part of the <A> </A>
tag. This information is given as
TARGET=”Framename”
The attribute via which the HTML file name is specified is the HREF attribute, which is a part of the <A> </A>
tag. This information is given as
<A HREF =”index.html” TARGET=”Main”> Visit Us </A>
frameindex.html
<html>
The New College
<frameset rows="20%,80%">
<frame src="course.html"></frame>
<frame src="home.html" name="main"></frame>
</frameset>
</html>
course.html
<html>
The New College
<ul>
<li><a href="aided.html" target="main">Aided Courses</a></li>
<li><a href="self.html" target="main"> Self Financing Courses</a></li>
</ul>
</html>
home.html
<HTML>
Welcome to The New College
</HTML>
aided.html
<html>
<U>Aided Courses</U><br>
BCOM<BR>
BA<BR>
BSC<BR>
</html>
self.html
<html>
<u>Self Financing Courses</u><BR>
BCA<BR>
BBA<BR>
BBM<BR>
</html>

'P.G. Department of Computer Science (Shift - II)

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

'P.G. Department of Computer Science (Shift - II)

Uploaded by

Copyright:

Available Formats

WEB_PROGRAMMING_UNIT_I_HTML

`P.G. Department of Computer Science (Shift – II)

Subject : WEB PROGRAMMING USING PHP AND MYSQL

1.1 Client Server Terminologies:

Client: A computer requesting for information is termed as client.

o Web Site Management

o Connect to an appropriate Server.

1.2 Browser Communication with a Web Server

1.2.1 Establish Connection:

1.2.2 Client issues a request and Server sends a response:

1.2.3 Server terminates the Connection:

1.3 Hyper Text Markup Language (HTML)

1.3.1 HTML tags

Types of HTML tags:

1.3.2 The Structure of an HTML Program

The syntax of <HEAD> tag is of the form:

Attributes of <BODY> tag:

BGCOLOR: Changes the default background color to the specified color.

Example: < BODY BACKGROUND=“star.gif” TEXT= red>

TITLES AND FOOTERS

The Syntax of <TITLE> tag is of the form:

<TITLE>SOME TEXT </TITLE>

Example: <TITLE>THE NEW COLLEGE </TITLE>

The Syntax of <ADDRESS> tag is of the form:

Example: <ADDRESS>THIS IS THE FOOTER </ADDRESS>

1.3.3 Text Formatting Tags

The New College,

1.3.4 Emphasizing Material in a Web Page

(i) Heading Styles

Output: The New College

(ii) Drawing Lines

The attributes to the <HR> tag are

(ii) SIZE: Changes the size of the rule.

(iii) WIDTH: Sets the width of the rule.

Example: Welcome to the New College

1.3.5 Text Styles

Example: <B>The New College</B>

Example: <I>The New College</I>

Example: <U>The New College</U>

1.3.6 Text Effects

<CENTER>The New College</CENTER>

Output: The New College

Its attributes are type and size.

(a) TYPE: To specify whether space has to be left horizontally or vertically.

TYPE=“HORIZONTAL” indicates that horizontal space has to be left.

(ib) Size: Indicates the amount of space has to be left.

Example: The New College

Controlling Font Size and Color

Its attributes are:

(i) FACE: Sets the font to the specified font name.

Output: The New College

1. Unordered List or Numbered List (ul)

1. Unordered Lists (Bullets)

The attributes that can be specified with <LI> are

TYPE: Specifies the type of the bullet.

Example: Some of these products include

2. Ordered Lists (Numbering)

The attributes that can be specified with <LI> are

(i) TYPE: Controls the numbering scheme to be used.

Example: Some of these products include

Definition term: appears after the tag <DT>

The <img> tag takes the following attributes.

Table rows can be of two types: