Chapter 7-WebApplication PDF

Download as pdf or txt
Download as pdf or txt
You are on page 1of 48

Chapter 7:

Web Applications

Informatics Practices Revised as per


CBSE
Class XII (CBSE Board) Curriculum
2015

Visit www.ip4you.blogspot.com for more….

Authored By:- Rajesh Kumar Mishra, PGT (Comp.Sc.)


Kendriya Vidyalaya Upper Camp, Dehradun (Uttarakhand)
e-mail : [email protected]
Introduction
A Web Application refers an application which
sends and receive information through Word
Wide Web over Internet or Intranet.
A typical Web Application may include-
 Hyper Text Information:
Information that contains links to other
information resources.
 Multimedia Information:
Text, movies, pictures and sound etc.
 Graphical User interface:
GUI which enables user to point and click to
request/submit information instead of typing.
What is Internet?
In simple words, an Internet is a network of networks,
spread over world-wide network of computers with
millions of users.
 Access to Internet is provided through Internet Service
Provider (ISP) such as MTNL, BSNL, Reliance, Airtel and Tata
etc. (in India).
 Internet begins with Advanced Research Project Agency
Network (ARPANet) in 1969 under American Defense Deptt.
 In 1986, the National Science Foundation establishes
NSFNet, which works as a backbone of Internet.
 In 1990, the British Programmer Tim Berners-Lee devised
Hypertext and HTML to create WWW.
 There is no owner of Internet. The Internet Society (IS) and
Internet Engineering Task Force (IETF) regulates the
Internet.
What is Web Browser?

A web browser is an Web Client program which


allows users to access and navigate the World
Wide Web over Internet.
 It provides an interface to interact with
Internet.
 It send request to Web Server for specified web
page and displays at client machine.
 It also maintains History of visited Web Pages
and may provide tools for easy web surfing.
Some commonly used Web Browsers are
Microsoft Internet Explorer, Mozilla FireFox,
Google Chrome, Opera and Webkit etc.
What is Web Server?

Web servers are computers on Internet on which


Web pages are stored. It is equipped with a
program which listens request from the web
client (Web Browser) and sends web pages.
The major functions of a web server are-
 Serving of Web pages on request of Browser.
 Controlling access and security of the server.
 Monitoring and logging server access statistics.
Some most popular Web Servers are Apache
Web Server (Open Source software for Linux),
MS Internet Information Server (IIS) and
Netscape Enterprise Web Server etc.
Web Address & URL
A location of a web server is called Website and each webpage
stored on a Website has a unique address called URL (Uniform
Resource Locator)
Ex. http://www.thinkquest.org/aboutus.html
A general structure of URL is-
Protocol://domain name/Directory Path/object name
 Protocol:
It specifies the type of protocol to be followed by server. Some
commonly protocols are http, https, ftp, new etc.
 Domain Name:
It specifies the name of web server on the Internet including domain
name like .com, .org, .mil, .edu or country domain like .in, .ca .au etc.
 Directory Path
It specifies the location of file/web page on the server.
 Object Name
It specifies the name of specific web page like index.html
Communication with Web Server
The Internet or WWW works on Client-Server computing model.
In this model your PC equipped with Web Browser works as
Web-Client and other machine which serves the pages called
Web servers. A Web server follows some protocols like HTTP,
FTP or SMTP etc.
When Web Browser (Web-Client) request for a HTML pages
stored on a remote machine (Web-Server), the server locates
the file and passes it to the client.

1. Request for HTML web page


Web-Client Web-Server
(Browser)
2. Server locates the file and
sends to client.
3. The Browser displays the
web page.
What is HTML ?
HTML is a document-layout and Hyper link-
specification language i.e. a language used to design
the layout of a document with Hyperlink.
HTML tells the Web browser how to display the
contents of a Hyper Text document including text,
images and other supported media.
 HTML is:
 Web page layout language.
 Hyper Link specification languages.
 HTML is Not:
 Word Processing tool.
 Programming language.
Elements of HTML document
HTML is made up of elements called Tags and Attributes,
which specifies the format of the documents.
 A Tag is a coded HTML command that indicates how parts of
web page should be displayed.
 Tags are not case sensitive and contained within Angle
Bracket <> i.e. <HTML> and <html> are same.
 Most of the Tags are used in pair i.e. begin and end of the
Tag. End Tag are begins with / character.
e.g. <Head> ………. </Head>
 An Attribute is a special word inside a Tag, which specifies
additional information to Tags such as colour, alignment etc.
 Most of the Attributes are followed by a Value (number or
words).
e.g. <BODY BGColor = “RED”>
Container and Empty Tag
There are two types of Tags are used in HTML.
 Container Tag
These HTML Tag written in pair i.e. starting <..> as
well as ending </…> .
Ex. <Title> My First Page < /Title>
 Empty Tag
These Tags require just a starting tag and not ending
tag.
Ex. <HR>, <BR> <IMG > etc.
HTML Tag Structure
 Every HTML Tag consist of a tag name, sometimes
followed by an optional list of Attributes, all closed in
Angel Bracket < >.
 Tags are in nested form. i.e. Starts later-Closed earlier.
 Multiple Attributes may appear after Tag Name, each
separated by space. The order of appearance is not
important.
 An Attribute’s value, if any is given after the equal (=)
sign in quotes after attribute name.
Ex. <A href = “http://www.google.com”>
 Quotes may be omitted if there is a single value or word
(without space).
Ex. <BODY bgcolor=RED>
<HR WIDTH = 30%>
Structure of HTML Document
Every HTML page is structured as follows- Example
<HTML>
<HTML>
<HEAD>
<HEAD>
<TITLE>
<TITLE> My First Page </TITLE>
……………..
<BODY>
</TITLE>
This is my Test Page written in
</HEAD>
HTML. HTML is easy to learn .
<BODY>
</BODY>
……………….
</HTML>
</BODY>
</HTML>
 <HTML> Identifies that the document is an HTML document.
 <HEAD> Contains information about document including its
title, scripts used, style definition and other descriptions.
 <TITLE> Contains title which appears on browser’ title bar.
 <BODY> Contains many other tags and attributes, which
specifies what to be displayed on Browser.
How to write HTML page?
The easiest way to create and view the stylish HTML
page is to use of HTML editor software like MS
Front Page, Macromedia Dream Viewer etc. But we
create a web page in any Text editor utility like
Note pad.
The following steps may be followed to create a web
page using Windows Note Pad utility.
 Open Note pad (Program Accessories Notepad)
 Type HTML code
 Save the file (File  Save) along with .htm or .html
extension.
 Close Note pad and View Page using any Web Browser
like Internet Explorer.
Commonly used Container Tags…
 <HTML> ….. </HTML>
This Tag marks the begin and end of HTML document. It
may contains <Head> and <Body> tag inside.
Commonly used Attributes are-
Attributes Value Description
DIR LTR (Direction of the Text)
RTL It specifies the direction of text in the
document either Left-to-right (LTR) or Right-
to-left (RTL)
Lang En, (Language)
Fr etc. It specifies the Language used in the
document e.g. English (en), French (fr),
Italian (it) , Hindi (hi) etc.
Example: <HTML Lang=EN DIR = LTR>
We can also use Kashmiri (ks), Nepali (ne), Marathi (mr), Sanskrit(sa) etc.
Commonly used Container Tags…

 <HEAD> ….. </HEAD> Tag


This Tag defines the document header. It contains
information like title, script and style etc.

 <TITLE> ….. </TITLE> Tag


This Tag contains the title and identifies its
content in a global context. Title is displayed in
the Title bar of the Browser.
Ex. <Title> My First Page </Title>
Commonly used Container Tags…
 <BODY> ….. </BODY> Tag
This is the largest Tag which defines the content of the document.
It may contains text, images, lists, tables and hyperlinks etc.
Attributes Value Description
Background Image Defines the background image to be displayed.
file Smaller image is tiled to cover the whole page.
Bgcolor Color Specifies the background color of the page.
Text Color Specifies the color of the text.
Link Color Specifies the color of the Hyper link.
VLink Color Specifies the color of the visited Hyper link.
ALink Color Specifies the color of the Active Hyper link.
LEFTMARGIN value Specifies the area left from the edge of page.
TOPMARGIN value Specifies the area left from the top of page.
Example: <Body BGCOLOR=“Red” TEXT=“#ffffff” LINK=“Yellow”
<Body Topmargine =60 Leftmargine=40>
Note : Margine value is defined in the pixel and 72 pixel = 1 inch
Commonly used Container Tags…
 <H1> ….. </H1> Heading Tag
HTML specifies six levels of headings, numbered
from 1 to 6. Headings are typically displayed in
larger fonts than normal body text. <H1> is the
largest and <H6> is smallest size.
If multiple headings are used, it should continuous
i.e. You can’t use <H4> after <H1> without using
<H2> and <H3>.
Attributes Value Description
Align LEFT (Alignment of the Heading Text)
RIGHT It specifies the alignment of text i.e.
CENTER Left/ Right/ Center.
Example: <H1> Kendriya Vidyalaya Sangathan </H1>
<H2> Regional Office – Jaipur Region </H2>
Commonly used Container Tags…
 <P> ….. </P> Paragraph Tag
The Paragraph Tag specifies the begin and end of the
paragraph of the text.
Attributes Value Description
Align LEFT ,RIGHT, CENTER Alignment of the Heading Text
Example: <P> This is a single line paragraph </P>

 Other Tags
The following tags are frequently used within a paragraph.
Tags Description
<B> ….</B> Specifies Bold Text
<I> …. </I> Specifies Italics Text.
<U> ….</U> Specifies Underline Text.
<TT> … <TT> Specifies Type writer text (fixed –width font)
<Sub>…. </Sub> Specifies the Subscript like 2 in H2O
<Sup> …. <Sup> Specifies the Subscript like 2 in X2
Commonly used Container Tags…
 <Font> …. </Font>
The Font tag defines the size, style and colour of the text. HTML
uses Relative font size from 1 to 7. Default value is 3. Each
successive Font size is 20% larger or smaller than default size.
Attributes Value Description
Size Values Specifies the relative size of the font.
(1 -7)
Color Color Specifies the color of the text.
Face Font Specifies the Font name. You can define multiple
name fonts separated by , so that if first font is not
supported/ available the second can be used.
Example: <Font Size = 4 color = Red > How are You </Font>
<Font Face =“ Arial” > Hello </Font>
<Font Face = “Broadway”, “Arial” > Good Bye </Font>
Commonly used Container Tags…
 <A> …. </A> Linking other Web Page or WebSite
Anchor tag defines the Active link of other Web page or File.
A hand shaped cursor appears when mouse is rolled over the
text, which indicates the active link.
Attributes Value Description
HREF File/Web Specifies the Web page or Web URL (Address) to
URL be linked with given text.
Example: <A Href = “www.google.com” > Google </A>
<A Href = “resume.doc” > My Bio-Data </A>
<A Href = “www.kvsangathan.nic.in/vacancy.htm” >
Vacancy at Kendriya Vidyalaya </A>

Color Code in HTML is 6 digit RGB value started with # sign.


RGB (Red-Green-Value), each is defined with 2 digit starting
Note with 00 to FF. e.g. #00000 (Black), #00FFFF (Aqua), #FF0000
(Red) and #FFFFFF is White etc. Color value can be given in
words also like Red, Black, White etc.
Commonly used Empty Tags…

<Base Font>
This Tag allow you to define the basic (default) size for the font,
which is used for normal text, where <Font> is not defined.
Attributes Value Description
Size (1 -7) Specifies the relative size of the font.
Color Color Specifies the color of the text.
Face Font name Specifies the Font name.
Example: <BASEFONT Size = 4 color = Red >
<BASEFONT Face =“ Arial” Size =4 >

Difference between <Font> and <BaseFont> tag


<Font> is a container tag which is used to change the
appearance of short segment of text, whereas <BaseFont> is
empty tag which is used to set the default font settings where
<font> is not defined.
Commonly used Empty Tags…

 <!.. Comment ..>


 <COMMENT>......</COMMENT>
You may define comment text which appears in
source code but not displayed in browser window.
Ex. <!.. This text is displayed at browser ..>
 <BR> Break Line
Some times, it is required to break a paragraph i.e.
remaining text to be appear on next line. <BR> tag
does this job.
Ex. <p> Hello! Every body ….. <br> How are you</p>
Commonly used Container Tags…
 <HR> Horizontal Rular
This tag produces a Horizontal line spread across the
width of the Browser window.
The Thickness, width and colour etc. can be defined by
the following attributes.
Attributes Value Description
Size Values Specifies the size (thickness) of the line. Default
is 3.
Color Color Specifies the color of the line.
Width Number Specifies the width of the line. It may be absolute
or % value or certain % of the Browser Window width.
NoShade - Specifies the shade to be appear or not. If
NOSHADE option is not given 3-D lines appears.
Example: <HR Size =5 color = Red Width = 80>
<HR Size = 4 Color= Yellow Width = 80% Noshade>
Commonly used Container Tags…
 <IMG> Displaying Images
This tag displays specified image file (.jpg, .gif, .bmp,
.png etc.) with defined size (width and height)
Attributes Value Description
SRC File name Specifies the image /picture file with path. If path
is not given then current folder is assumed.
Width Number Specifies the width of the image. If given width is
smaller than picture’s width, then picture is
resized.
Height Number Specifies the height of the image. If height is
smaller than picture’s height, then picture is
resized.
Align Alignment Specifies the Alignment of the image as Left,
Right, Top, Middle and Bottom (default).
Border Number Specified the thickness of border. 0 for no border.
Example: <IMG SRC=“myphoto.jpg” Width = 200 Height=300>
Un Ordered List
 <UL> ….. </UL>
Each list element is defined with <LI> tag.
Attributes Value Description
TYPE Disk It specifies the type Bullet symbol. Default is
Square Disk type.
Circle
Example: <UL>
<LI> Drink
<UL Type=Square>
<LI> Tea Drink
<LI> Coffee Tea
</UL> Coffee
<LI> Fruits Fruits
<UL Type=Square>  Apple
<LI> Apple  Mango
<LI> Mango
</UL>
</UL>
Ordered List
 <OL> ….. </OL>
Attributes Value Description
TYPE A or a It specifies capital/small A,B,C,D.. etc.
I or i It specifies capital/small Romans I,II,III etc. It
1 specifies the number 1,2,3 etc. (Default)
START Value Defines starting value of list.
Example: <OL Type=A>
<LI> Drink
<OL>
<LI> Tea A. Drink
<LI> Coffee 1. Tea
</OL> 2. Coffee
<LI> Fruits B. Fruits
<OL Type=I> I. Apple
<LI> Apple II. Mango
<LI> Mango
</OL>
</OL>
Tables in HTML
 <Table> ….. </Table>
Tables are useful to display data in tabular form.
The following core tags are used to create a table.
 <Table>.. </Table> defines a table object.
 <TR>… </TR> defines a Table Row.
 <TD>…</TD> defines a Table Data (cell value)
 <TH> .. </TH> defines Column Header.
 <CAPTION> .. </CAPTION> Defines caption of table.
Caption
Student’s Details
Table Column
Row Name Age Class Header
Ajay 14 9
Amit 12 7 Table Data
Table - Simple Example
<Table Border=“3”>
<Caption> <B>Student’s Details </B></Caption>
<TR>
<TH> Name</TH> <TH>Age</TH> <TH>Class></TH>
</TR>
<TR>
<TD> Ajay</TD> <TD>14</TD> <TD>9</TD>
</TR>
<TR>
<TD> Amit</TD> <TD>12</TD> <TD>7</TD>
</TR>
</TABLE>

Student’s Details
Name Age Class
Output Ajay 14 9
Amit 12 7
Attributes in <Table> Tag
Attributes Value Description
Background Color Specifies the background image file (.jpg, .gif
etc.)
Bgcolor Color Specifies the background color.
Border Value Defines the outline border size (0 – no border)
Bordercolor Color Specifies the color of border.
Frame Above, Below, Specifies the portion of border will display.
Box, Hsides, Used with Border attribute.
Vsides etc.
Rules All, Cols, Rows, Specifies the inside border edges to be
None displayed.
Cellspacing Value Space between cells.
Cellpadding Value Space between the cell border and cell data.
Height Value Defines the height of table in pixel.
Width Value Defines the width of table in pixel.
Align Left, Right, Specifies the alignment of table across the
Center page.
Example: <Table Bgcolor=“Red” Border=3 Rules =“All” Align= center>
Attributes in <TD> Tag
Attributes Value Description
Background Color Specifies the background image file (.jpg, .gif
etc.) for a cell.
Bgcolor Color Specifies the background color for a cell.
Rowspan Value Defines the Span of a cell in respect rows.
Colspan Value Defines the span of cell in respect of columns.
Width Value Defines the width of cell in pixel or % of table.
Align Left, Right, Center Specifies the alignment of data in the cell.
VAlign Top, Middle, Bottom Defines Vertical Alignment, when rowspan of a
cell is more than one row.

<Table >
<TR>
<TD> Item1</TD><TD RowSpan=2 VAlign=“Middle” >Item2<TD>Item3</TD>
</TR>
<TR> Item1 Item3
<TD>Item4</TD><TD>Item5</TD> Item2
</TR> Item4 Item5
</TABLE>
Example Coding
<HTML>
<HEAD>
<TITLE> Computer Viruses</TITLE>
</HEAD>
<BODY BGCOLOR= #00ffff Topmargin=40 leftmargin=40>
<BASEFONT SIZE=3 FACE="Arial">
<IMG src="photo1.jpg" width="78" height="46" align="left">
<H1> What is Computer Virus?</H1>
<p align=left> A <b>virus</b> is basically an <i>executable file</i> that is designed
such that it is able to infect documents, has ability to survive by <u>replicating</u>
itself.<br> Usually to avoid detection, a virus disguises itself as a legitimate program that a
user would not normally suspect to be virus. </p>
<H2> Whar Virus can do? </H2>
<p> <font size=5 color= #ff0000 >Viruses </font>are designed to corrupt or delete data
on the hard disk, i.e. on the FAT (File Allocation Table).</p>
<H2> Types of Virus </H2>
<hr size=6 width=100% noshade>
<Font color= Maroon>
<p> Boot Sector Viruses </p>
<p> File or Program Viruses</p>
<a href="http://www.google.com/" ><font color="#ffff00" size=3> Get more on
Google.com</font></a>
</BODY>
</HTML>
How it works…
Forms in HTML
Forms are means to collect information/data from the Site-
visitor or client.
<FORM> … </Form> is used to define a form in <BODY>
section of HTML page.
Form contains some GUI controls to interact with users.
Some of important controls are-
 Buttons
 Submit Button
 Reset Buttons
 Push Buttons
 Check Boxes
 Radio Buttons
 Combo Boxes (Menus)
 Password field
 Text Input (Text Field, Text Area etc.)
Creating Forms
 <FORM> ….. </FORM>
This Tag can be used in <BODY> section to create
a form. It may contains many other input controls.
Commonly used Attributes are-
Attributes Value Description
Name String Specifies the name of the form
Action Script It specifies the Script or email-ID or URL which
or URL will receive data (destination of form’s data).
Method Get Specifies how the form-data is submitted.
Post Get- form data is submitted as URL variables.
Form Post-form data is submitted as HTTP post.
Form- Opens a new form as per specified URL.
Example: <Form Method=Get Action=“www.google.com”>
Commonly used method is-
<Form Method=Post Action=“mailto:[email protected]”>
Adding Input Controls on the Form
 <INPUT >
This Tag defines various input controls to get input from the user.
Attributes Value Description
Type Text Defines a Text Box.
Radio Defines a Radio Button.
Checkbox Defines a Check Box
Button,
Password Creates a Password input box. Image &
Submit Creates a Submit Button. File are not
Reset Creates a Reset Buttons. covered in
Button Creates a push buttons. the syllabus
Image Creates an image collector.
File Creates a file collector.
Name String It specifies the name of the input control.
Value String/Val Specifies the initial value for the control.
Size value Specifies the size of control.
Example: <INPUT Type=“Text” Name=“St_name”>
<INPUT Type=“Submit” Name=“MyButton” Value=“Submit”>
Adding Input Controls on the Form
 <SELECT>… </SELECT>
This Tag creates a Drop-down Option menu from which user may
select an option.
<SELECT Name=“name” Size=“Value>
<OPTION Value=“Value” [Selected]> Prompt </OPTION>
…………………………………………………
</SELECT>

Example

<SELECT Name=“Stream”>
<OPTION Value=“Science” > Science </OPTION>
<OPTION Value=“Commerce”> Commerce </OPTION>
<OPTION Value=“Arts” > Arts </OPTION>
</SELECT>

Not covered in the syllabus. Recommended for advanced reading.


Sample Form -Putting all together
<html>
<head><title> My page </title> </Head>
<body>
<H1> <U>Enquiry Form </u></h1>
<Form method=Post action= "maoilto:[email protected]">
<b>Name </b> <Input type=Text name="st_name"><br>
<b>Sex </b>
<Input type=Radio name="sex" value="Male"> Male
<Input type=Radio name="sex" value="Female"> Female<Br>
</b>Email </B><Input type=Text Name ="email“> <br>
Stream <SELECT name="stream">
<Option value="Science"> Science </Option>
<Option value="Commerce"> Commerce </OPTION>
<Option value="Arts"> Arts </Option>
</SELECT> <Br>
Comment<Br>
<TextAREA name="comment" Rows=5 cols=50> </TEXTAREA><br>
<INPUT Type=Submit Value ="Send">
<INPUT Type=Reset Value ="Clear">
</Form>
</body>
</html>
Sample Form
What is XML?
 eXtensible Markup Language (XML) is also a text-
based mark-up language which allows to create
application specific structured documents.
The common feature of XML are-
 XML was designed to carry or share data, not to
display.
 XML is self-Descriptive (Tags are not predefined).
 XML is free and Extensible ( It is Meta Language).
 XML is platform Independent.
 XML may be used to create a new Mark-up
Language.
 It is supported and recommended by W3C.
HTML v/s XML
HTML and XML both are different types of Mark-up language.
 HTML
 HTML formats documents and display it as web page.
 HTML Tags are pre-defined.
 HTML Tags may be Empty type.
 HTML Tags are not case sensitive.
 HTML documents are directly viewable in a Browser.
 XML
 XML documents carry data along with their description.
 XML Tags are not pre-defined. You may create your own Tags.
 XML Tags must be Container type.
 XML Tags are case sensitive.
 XML documents are viewable if its Style Sheet is available.
Why XML is used (Advantages)

XML offers the following advantages-


 XML is fully compatible to various application
developed in Java or any other languages.
 XML is portable and can be used on any network
or hardware like palmtop or PDAs.
 XML is Extensible i.e. You may create your own
tags.
 XML is platform Independent.
 XML document can be stored in the database.
 XML can be used to share data within wide area
networks. It is most suited to Internet.
Structure of XML Document System

A XML Document is intended to display data like HTML.


An XML document system comprises the following-
 Style Sheet (CSS or XSL)
It defines the style (How it would appear i.e. font,
color, size alignment etc.) of the elements.
 Grammar Structure (DTD)
It is optional component in XML document system
and defines the Rules of the document (Tag
definitions).
 XML File
It contains and describes actual data.
How to Prepare XML Document
In order to prepare XML Document system, you may
do the following steps-
 Prepare XML document file as per problem
XML document is divided into two part.
1. The Prolog :
Preface or Introduction to the XML document. It
includes An XML declaration, Comments etc.
2. The Data Instance :
It contains actual data.
 Prepare a style-sheet file for XML file
It contains style rules that tells a browser how to
display an XML document.
 Link the XML file with Style sheet
Example to create XML document.
 Expected View on Browser
Computer Parts

Suppose we
Mother Board
want to make an
XML document
Asus
which is
P3B-F
displayed in
1230.00
browser as
shown here
TFT Monitor

LG Electronics
995e
8500.00
Example to create XML document.
 Preparation of XML (test.xml) document Prolog

<?xml version=“1.0” encoding = UTF-8“ ?>


<?xml-stylesheet type=“text/css” href=“parts.css”?>
<PARTS>
<TITLE> Computer Parts </TITLE>
<PART> Linking of .css
<PARTNAME>Mother Board</PARTNAME> (Style Sheet) file
<MANUFACTURER>Asus</MANUFACTURER>
<MODEL>P3B-F</MODEL>
<COST>1230.00</COST>
Data
</PART>
Instance
<PART>
<PARTNAME>TFT Monitor</PARTNAME>
<MANUFACTURER>LG Electronics</MANUFACTURER>
<MODEL>995e</MODEL>
<COST>8500.00</COST>
</PART>
</PARTS>
Example to create XML document.
 Preparation of StyleSheet (part.css) file
PARTS {display:block}
TITLE {display:block; font-fanily:arial; color:#008000;
font-weight:600; font-size:16 margine-top:12pt;
text-align:center}
PART {display:block}
PARTNAME {display:block; font-fanily:arial; color:#008000;
font-weight:400; font-size:14 margine-left:10pt;
margin-top: 10pt}
MANUFACTURER {display:block; font-fanily:arial; color:#600060;
font-weight:400; font-size:14 margine-left:30pt;
margin-top: 10pt}
MODEL {display:block; font-fanily:arial; color:#600060;
font-weight:400; font-size:14 margine-left:30pt;
margin-top: 10pt}
COST {display:block; font-fanily:arial; color:#800000;
font-weight:400; font-size:14 margine-left:30pt;
margin-left: 5pt}
Summery of HTML Tags
Tags Attribute
<HTML>…...</HTML> DIR , LANG
<HEAD> ….. </HEAD> -
<TITLE> …… </TITLE> -
<BODY> ……</BODY> Background, Bgcolor, Text, Vlink,
Alink, Leftmargin, Topmargine
<H1-6> …. </H1-6> ALIGN
<P> … </P> ALIGN
<B>..</B> <I>..</I> -
<U>..</U> <TT>..</TT>
<SUB>..</SUB> <SUP>.. </SUP>
<FONT<..</FONT> SIZE, COLOR, FACE
<A>..</A> HREF
<BASEFONT> SIZE, COLOR, FACE
<BR> -
<HR> SIZE, COLOR, WIDTH, NOSHADE
<IMG> SRC, WIDTH, HEIGHT, BORDER
<!....> -
Summery of HTML Tags
Tags Attribute
<OL>… </OL> TYPE, START
<UL>…. </UL> TYPE
<LI>….. </LI> -
<TABLE> .. </TABLE> BACKGROUND,BGCOLOR, ALIGN, BORDER,
CELLSPACING, CELLPADDING, HEIGHT,
WIDTH
<TD>….. </TD> BACKGROUND, BGCOLOR, ALIGN, VALIGN,
ROWSPAN, COLSPAN, WIDTH
<FORM> …. </FORM> NAME, ACTION, METHOD
<INPUT> …. </INPUT> TYPE, NAME, VALUE
Type may be-
TEXT- Text Box
PASSWORD – Password Field
RADIO – Radio Button
CHECKBOX – Checkbox control
SUBMIT- Submit button
RESET- Reset/Clear Button

You might also like