Different Web Page Tags

Different types of Tag
• The different types of basic tags that are used to design a web page
are described below.
1. HTML Tag :- It is necessary to write the code for an HTML page
between <HTML> and </HTML>. Here opening tag tells the
browser that ‘This is the start of an HTML document’ and closing
tag of HTML tells ‘This is the end of HTML document’.
2. Head Tag:- The headlines tags are used to display headings on the
web page in various sizes. These tag can provide main and sub
headings. HTML documents supports six levels of heading tag from
<h1> to <h6>.
3. Title Tag :- The title tag is used inside the <head> tag to mention
title.
4. Body Tag :- All the content to be displayed on the web page has to
be written within the body tag. So whether text, headlines, textbox,
checkbox or other any possible content every thing to be displayed
must be kept within the <BODY> tag.
Some major Attributes
1. BGCOLOR :- It can be used for changing the background color of the
page. By default the background color is white.
syntax :- <BODY BGCOLOR=“VALUE”>
eg :- <body bgcolor=“silver”>
2. Background Image:- It is used for specifying the image to be displayed
in the background of the page.
syntax :- <BODY BACKGROUND = “VALUE>
eg :- <body background=“photo.jpg”>
3.Background sound :- sound can be embedded in the web page .
syntax :- <BGSOUND src= soundURL loop=value>
eg :- <BGSOUND src=“music.mp3” loop =infinate>
4. F OREGROUND COLOR (TEXT COLOR):- It is ued for specifying the
color of the text displayed on the page.
Syntax :- <BODY BGCOLOR=“VALUE” TEXT =“VALUE”>
e.g :- <body bgcolor=“silver” text =“yellow”>
Formatting Heading
• Headers are used to specify the headings of sections or sub sections in a document.
Depending on the desired size of the text, any six available levels (<H1> to <H6>) of
headers can be used.
<html>
<head>
<title>
This is my first web page.
</title>
</head>
<body>
<h1> This is my first webpage.</h1>
<h2> This is my first web page.</h2>

</body>
</html>
Attributes of heading Tag
• The headings are generally left aligned. But,
we can change the alignment to the right or
center by using ALIGN attribute of heading
tag. The syntax is;
<H1 ALIGN=“……..”> introduction </H1>
• Here, the space within the inverted commas
can contain either LEFT, CENTER or RIGHT.
Text Formatting Tags
• Every text on a web page can be formatted using
various tags. They can be related with font, setting,
alignment, setting columns, horizontal line, color,
superscript, subscript, etc. Here explained some
commonly used text formatting tags.
Font setting Tag:- Font setting tag in HTML can be used
for text style specifications. It provides the flexibility
of changing the characteristics of the font such as
face, size and color. Every browser has default font
setting that governs the default font face , size and
color. Normally, the default is Times New Roman
12pt with the color being black.
• The tag for font setting is <FONT> …. </FONT>.it has major three
attributes.
1. FONT FACE:- it is used to set the font type of the text. The syntax is
<FONT FACE=“value”> Text content </FONT>
Here font face value can be Arial, comic sans, preeti etc.
2. FONT SIZE:- This attribute is used to specify the size of the text. The
syntax is
<FONT SIZE=“value”> Text content </FONT>
Font can be displayed in any of the 7 sizes. Here <FONT SIZE=“1”
indicates 8pt size, 2 indicates 10 point and 3 indicates 12point and
so on.
3. FONT COLOR :- This attribute is used to specify the coloor of the
text. By default the color of the text is black. The syntax is
<FONT COLOR =“value”> Text content </FONT>
The possible color can be red, green, yellow etc.
Paragraph formatting tag
• To organize the text into paragraphs we should

use the paragraph tag in HTML. i.e <p>…</p>.
• Attributes of paragraph tag:-The paragraph on the
web page can be aligned by using “ALIGN”
attribute of <p> tag. The syntax is
<P ALIGN= “value”>
The possible values for ALIGN are left, center and
right.
Line break and comment in HTML
• BR: This tag is used for inserting a line break.
The text written after <BR> tag is displayed
from the beginning of the next line onwards.
This tag does not need a corresponding
terminating tag.
• We can add comments to our HTML source
using following syntax.
<! –write comments here -- >
Formatting Text
• BOLD: The text can be displayed in boldface by writing it in between the <B> and
</B> tags.
• ITALICS: it starts with <I> and ends with </I>. It is used to display in italics.
• UNDERLINE: It is used for underlining the text to be displayed. It starts with <U>
and ends with </U>.
• EM: The <EM> tag is used for emphasizing the text in the manner most
appropriate to the browser.
• Preformatted text <PRE> and </PRE> Tag: This tag is used to present the text
exactly written in the code, including white space characters. It means
preformatted tag is used to display the text in the browser window in the same
format as seen in the editor without changes.
• <SUP> ……</SUP> Tag : it is used to obtain a super script to some part of the text.
• <SUB> ……</SUB> Tag: It is used to obtain a sub script to some part of the text.
• <MARK> Tag : it used to mark or highlight the text. For eg
<MARK> This is my first web page </MARK>
Lists Tags
• List are used when the data are to be mentioned in the form of points such as cause
of a particular issue, list of items, name of schools etc. lists break up the monotony
of a long paragraph and directs the reader’s attention to the essential parts. Lists
are segregated basically into two types, namely ordered and unordered lists.
1. Ordered Lists :- Lists having numbered items are know as ordered lists. They are
used when the items in the lists having natural order. To make an ordered lists we
use <OL> tag. The syntax of the ordered list is <OL> tag is:
<OL start=“Value” TYPE=“Value”>
<LI> List item1 </LI>
</OL>
• The attributes of <OL> are;
START: It specifies the start value(number) of the numbering sequence. The possible
values are 1, 2, 3 and so on. The numbering starts from the START attribute’s
value.
TYPE: it specifies the numbering sequence and numbering style. The type of the
numbers can be 1, 2 or I, II o r A< B or a, b and so on.
• Unordered Lists :- when we like to display a group of items by adding a
bullet to the group of items in the order in which the items are
created, then the list is called list. This bulleted list os also called
unordered list, because the points in the list have no particular order.
• <UL> and </UL> tag is used to create and delimit an unordered list.
The syntax of the <UL> Tag is
<UL TYPE=“VALUE”>
</UL>
Here, TYPE is an attribute of <UL> tag that is used to change the bullet
style. The value of TYPE attribute can be “DISC”, “SQUARE” or
“CIRCLE”.
Tables
• Tabular representation is the best way to present grouped information.
Tables are used to arrange the layout of the web page. Rather than simply
creating the rows and columns, the table organizes and enhances the look of
the content on the page. The basic tag for creating a table are
1. <TABLE> ………… </TABLE>
This is the main tag. It tells the browser that a table follows i.e. this marks
the beginning and end of table.
The syntax is;
<TABLE ALIGN =“…….”
BORDER=“……..”
CELL PADDING=“……..”
CELL SPACING=“………..”
WIDTH=“……….”
…………
…………
</TABLE>
2. <TR> …….</TR> :- This stands for the table row. It defines a horizontal
row that consists of Table Data cells. The syntax is;
<TABLE>
<TR BGCOLOR=“…..”>
</TR>
</TABLE>
3. <TD> ……… </TD> :- This stands for the table data. This tag specifies an
individual block or cell in a table row. The syntax is;
<TABLE>
<TR>
<TD ALIGN=“………”
COLSPAN=“………..”
ROWSPAN=“………”
</TD>
</TR>
</TABLE>
Forms
• Users can talk back to web site owner through the forms that they
fill up and submit to the web site. With <FORM> tag we can add to
thw web pages a guestbook, order forms, surveys, get feedback,
driving license or put in any other form that we wish.
• Forms can have fields, text, tables, images and most other objects
that can be inserted on a web page. The user fills in a form by typing
into fields, clicking radio buttons and check boxes , and selecting
options from drop down menus. The user can submit the form by
clicking a button , usually labeled “submit”.
• A form typically has a form handler, which is method of collecting
information from the form. A form handler can be used to
- Store data submitted by the user.
- Update a database with the data submitted by the user.
- Post the data on a web page.
• Forms can be classified into three sections
mainly ;
- Form header
- Input fields
- Action buttons
• Form and INPUT tag :- To add a form we use
<FORM> ….. </FORM> tag inside <BODY> tag.
These tags inform the browser that everything
specified between them belongs to form.
• Form Header :- Form header can be added to
the form by using the <P> tag or <DIV> tag.
Attributes to FORM tag
• From tag can have two attributes :
1. Method :-it specifies how the browser communicates with the
server. Possible values are “GET” and “POST”. GET method is
used in case data from a pre-established index needs to be
queried. If the information in the form is to be collected for later
purposes then the POST method is used.
2. ACTION :- This specifies what CGI script is used to process the
data. The values could either be a URL to the script or an email
which will send form directly to the specified address. For eg.
<FORM>
ACTION= MAILTO:emailID
METHOD=“POST” NAME=“NAME OF THE FORM”>
</FORM>
Introduction to HTML 5
• HTML 5 is the fifth and current version of HTML. It has improved available for documents and has
introduced application programming interface (API) and Document Object Model (DOM).
• Features
1. It has introduced new multimedia features which supports audio and video controls by using
<audio> and <video> tags.
2. There are new graphics elements including vector graphics and tags.
3. Enrich semantic content by including <header> , <footer>, <article>, <section> and <figure> are
added.
4. Drag and Drop.
5. Get location services
6. Web storage facility
7. Use SQL database to store data offline
8. Allows to draw various shapes like triangle, rectangle. Circle etc.
9. Capable of handling incorrect syntax.
10.Easy DOCTYPE declaration . i.e <!doctype html>
11.Easy character coding , i.e <meta charset=“UTF-8”.
Elements of HTML 5
• Write from book. At least write 10 of them.
Cascading style sheets
• Introduction :- There are very little options while
working or creating attractive document. HTML
is simple markup language and if we want to do
something complicated, we need to use
something different. Style sheet is a tool which
offer more control over layout. Style sheet is a
best approach for creating attractive pages.
• Also write six components of CSS from book.

Different Web Page Tags

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

Different Web Page Tags

Uploaded by

Copyright:

Available Formats

Different types of Tag

<h4> This is my first web page.</h4>

• To organize the text into paragraphs we should

• Also write six components of CSS from book.

You might also like