PROJECT

ON

“COMPUTER APPLICATION 2 PROJECT FILE ON HTML”

PROJECT REPORT SUBMITTED IN PARTIAL FULFILLMENT OF THE
REQUIREMENT OF BACHELOR OF BUSINESS ADMINISTRATION
(BANKING AND INSURANCE)

TO

GURU GOBIND SINGH INDRAPRASTHA UNIVERSITY

SUBMITTED BY:

HUNEET SINGH

00890201816

UNDER THE GUIDANCE OF

Mrs. HARNEET KAUR

SRI GURU TEGH BAHADUR INSTITUTE OF MANAGEMENT

AND INFORMATION TECHNOLOGY
(AFFILIATED TO GGSIPU UNIVERSITY, DELHI)

(2016-2019)

1
 TABLE OF CONTENT

SNO. CONTENT PAGE NO.

1 Declaration 5

2 Certificate 6

3 Acknowledgement 7

4 Introduction to HTML 8

5 Uses of HTML 9-10

6 Tags of HTML 10-11

7 Elements of HTML 12-13

8 Structure of an HTML document 13-14

9 The UL and OL Tag 15-16

10 Container tags and Empty tags 17

11 HTML Table 18

12 HTML Frames 19-22

13 HTML Forms 23-25

14 Q. Write the coding for inserting a table. 26

2
15 Q. Write the coding for inserting the table of27
production and sales table.

16 Q. Write the code of hypertext reference. 28

17 Q. Write the code for making a frame. 29

18 Q. Write the code in HTML to 30

demonstrate the use of order and un-order list.
19 Q. Write the code in HTML to change 31
background Web Page.
20 Q. Write the code in HTML to 32
demonstrate various formatting style and insert an
image in web page.
21 Q. Write the code in HTML to design a table with33
different style.
22 Q. Write the code for inserting the frame divided in34
3 parts.
23 Q. Write the code in HTML to design a 35
Sign Up Form.
24 Q. Write the code in HTML to design a web page for36
Purchase Order Form.
25 Q. Write the code in HTML to design a 37
web page for Food Corner
26 Q. Write the code in HTML to design a 38-40
web page for Online Reservation.
27 Q. Write the code in HTML to design a 41-45
web page for various Insurance Business.
28 Q. Write the code in HTML to design a 46-49

3
 web page for Online Shopping.
29 Q. Write the code in HTML to design a 50-53
web page for Commercial Bank

DECLARATION

4
I hereby declare that the project work submitted to the Guru Gobind
Singh Indraprastha University is record of an original work done by
me under the guidance of Mrs. Harneet Kaur, faculty member , Sri
Guru Tegh Bahadur Institute Of Management And Informational
Technology.

…………………………

(Signature of the scholar)

Place: Delhi Name: HUNEET SINGH

Date: Enrollment No. : 00890201816

CERTIFICATE

5
This is to certify that HUNEET SINGH, student of Sri Guru Tegh
Bahadur Institute Of Management And Informational Technology
of course BBA B&I Batch (2018) , has completed his file work title
“Computer Application 2 Project File on HTML“ under my guidance
and supervision . This work is genuine and authentic.

……………………………..

Signature of guide

Mrs. HARNEET KAUR

……………………………..

Place: Delhi Signature of scholar

Date: HUNEET SINGH

ACKNOWLEDGEMENT

6
I offer my sincere thanks and humble regards to Sri Guru Tegh
Bahadur Institute of Management and Information Technology ,
Guru Gobind Singh Indraprastha University, Delhi for imparting us
very valuable professional training in BBA (B&I). I pay my gratitude
and sincere regards to Mrs. Harneet Kaur, my project guide, for giving
me the cream of her knowledge. I am thankful to her as she gave her
moral support and guided me in different matters regarding the topic. I
am also thankful to her as she has been a constant source of advice,
motivation and inspiration. She was very kind and patient while
suggesting the outlines of the project and correcting my doubts

……………………..

Signature of Scholar

Name: HUNEET SINGH

Enrollment No.:00890201816

Introduction to HTML

7
Hypertext Markup Language (HTML) is the standard markup
language for creating web pages and web applications. With Cascading
Style Sheets (CSS) and JavaScript, it forms a triad of cornerstone
technologies for the World Wide Web. Web browsers receive HTML
documents from a web server or from local storage and render them into
multimedia web pages. HTML describes the structure of a web page
semantically and originally included cues for the appearance of the
document.

HTML elements are the building blocks of HTML pages. With HTML
constructs, images and other objects, such as interactive forms, may be
embedded into the rendered page. It provides a means to create
structured documents by denoting structural semantics for text such as
headings, paragraphs, lists, links, quotes and other items. HTML
elements are delineated by tags, written using angle brackets. Tags such
as <img /> and <input /> introduce content into the page directly. Others
such as <p>...</p> surround and provide information about document
text and may include other tags as sub-elements. Browsers do not
display the HTML tags, but use them to interpret the content of the page.

Uses of HTML

8
Hypertext Markup Language (HTML) is the standard markup language
for creating web pages and web applications. With Cascading Style
Sheets (CSS) and JavaScript it forms a triad of cornerstone technologies
for the World Wide Web.

Web browsers receive HTML documents from a web server or from

local storage and render them into multimedia web pages. HTML
describes the structure of a web page semantically and originally
included cues for the appearance of the document.

HTML elements are the building blocks of HTML pages. With HTML
constructs, images and other objects, such as interactive forms, may be
embedded into the rendered page. It provides a means to create
structured documents by denoting structural semantics for text such as
headings, paragraphs, lists, links, quotes and other items. HTML
elements are delineated by tags, written using angle brackets. Tags such
as <img /> and <input /> introduce content into the page directly. Others
such as <p>...</p> surround and provide information about document
text and may include other tags as sub-elements. Browsers do not
display the HTML tags, but use them to interpret the content of the page.

HTML (Hyper Text Markup Language) is a language used for coding

websites. It is very powerful and supports a variety of features,
including:

9
 1. Text and all places where it is used, i.e. paragraphs, headings,
quotes, etc.
2. Multimedia: images, audio, and video,
3. The so-called canvas, which allows you to "draw" on the Web
page using JavaScript code.

Tags of HTML

Tag Description
<body> Defines the document's body
<b> Defines bold text
<br> Defines a single line break
<center> Defines centered text
Specifies column properties for each column within a
<col>
<colgroup> element 
Specifies a group of one or more columns in a table
<colgroup>
for formatting
<font> Defines font, color, and size for text
<frame> Defines a window (a frame) in a frameset
<frameset> Defines a set of frames
<h1> to <h6> Defines HTML headings
<head> Defines information about the document
<height> Returns the height of an ImageData object
<hr> Defines a thematic change in the content
<html> Defines the root of an HTML document
<img> Defines an image
10
<input> Defines an input control
<li> Defines a list item
<ol> Defines an ordered list
<table> Defines a table
<td> Defines a cell in a table
<th> Defines a header cell in a table
<title> Defines a title for the document
<tr> Defines a row in a table
<ul> Defines an unordered list
<width> Specifies the width of the element

Elements of HTML
An HTML element is defined by a starting tag. If the element contains
other content, it ends with a closing tag, where the element name is
preceded by a forward slash as shown below with few tags −

Start Tag Content End Tag

<p> This is paragraph content. </p>
<h1> This is heading content. </h1>
<div> This is division content. </div>
<br />

So here <p>....</p> is an HTML element, <h1>...</h1> is another

HTML element. There are some HTML elements which don't need to be

11
closed, such as <img.../>, <hr /> and <br /> elements. These are known
as void elements.

HTML documents consists of a tree of these elements and they specify

how HTML documents should be built, and what kind of content should
be placed in what part of an HTML document.

It is very much allowed to keep one HTML element inside another

HTML element −

Example
<html>

<head>
<title>Nested Elements Example</title>
</head>
<body>
<h1>This is <i>italic</i> heading</h1>
<p>This is <u>underlined</u> paragraph</p>
</body>
</html>

This will display the following result −

This is italic heading

This is underlined paragraph

Structure of an HTML document

An HTML document has two* main parts:

12
 1. head. The head element contains title and meta data of a web
document.
2. body. The body element contains the information that you want to
display on a web page.

* To make your web pages compatible with HTML 4, you need to add a
document type declaration (DTD) before the HTML element. Many web
authoring software add DTD and basic tags automatically when you
create a new web page.

In a web page, the first tag (specifically, <html>) indicates the markup
language that is being used for the document. The <head> tag contains
information about the web page. Lastly, the content appears in the
<body> tag. The following illustration provides a summary.

13
 Summary of Basic HTML Tags

The UL and OL Tag

There are three types of lists. The first two are bulleted and numbered
lists. Needless to say, those on high who name such things couldn't
simply call them "Bulleted" or "Numbered", but "Unordered" and
"Ordered".

14
  UL – Unordered lists:

Example:

 Apples
 Oranges
 Bananas

UL Code:
<ul>
  <li>List item 1</li>
  <li>List item 2</li>
</ul>

 OL – Ordered Lists:

Example:

1. Breakfast
2. Lunch
3. Dinner

OL Code:
<ol>
  <li>List item 1</li>
  <li>List item 2</li>
</ol>

Lists can be "nested" or put inside one another.

 Fruit
o Oranges
o Bananas
 Vegetables:

15
 1. Peas
2. Corn

Be careful to close tags in the reverse order they were opened, and with
lists it can get confusing. The trick is to indent your code. Take a look at
this page's source code and you will see what I mean.

Container tags and Empty tags

1. Container Tags - A container tag in HTML is one which has both

opening and closing tags. There are some tags in HTML which

16
 don't have a closing tag. They end within the same tag.
Examples:
<html> is a container tag, it has it's closing tag as </html>. Other
examples are <body>, <head>, <p> etc. These are called container
tags because they contain something, within the two tags.

2. Empty Tags - Empty tags in HTML are DOM Element Nodes that
never have end tags, and more importantly, they can only have
“attribute”, they can never have :

 Element childnodes (embedded tags)

 CDATA childnodes (raw text)
 comment childnodes

So innerText and innerHTML DOM APIs properties of such Elements

will always be null.

HTML Table
An HTML table is defined with the <table> tag.

17
Each table row is defined with the <tr> tag. A table header is defined
with the <th> tag. By default, table headings are bold and centered. A
table data/cell is defined with the <td> tag.

HTML Frames

18
HTML frames are used to divide your browser window into multiple
sections where each section can load a separate HTML document. A
collection of frames in the browser window is known as a frameset. The
window is divided into frames in a similar way the tables are organized:
into rows and columns.

Disadvantages of Frames

There are few drawbacks with using frames, so it's never recommended
to use frames in your webpages −

 Some smaller devices cannot cope with frames often because their
screen is not big enough to be divided up.

 Sometimes your page will be displayed differently on different

computers due to different screen resolution.

 The browser's back button might not work as the user hopes.

 There are still few browsers that do not support frame technology.

Creating Frames

To use frames on a page we use <frameset> tag instead of <body> tag.

The <frameset> tag defines, how to divide the window into frames. The
rows attribute of <frameset> tag defines horizontal frames and cols
attribute defines vertical frames. Each frame is indicated by <frame> tag
and it defines which HTML document shall open into the frame.

Frame's name and target attributes

One of the most popular uses of frames is to place navigation bars in one
frame and then load main pages into a separate frame.

19
Let's see following example where a test.htm file has following code −

< html>
<html>

<head>
<title>HTML Target Frames</title>
</head>
<frameset cols = "200, *">
<frame src = "/html/menu.htm" name = "menu_page" />
<frame src = "/html/main.htm" name = "main_page" />
<noframes>
<body>Your browser does not support frames.</body>
</noframes>
</frameset>
</html>

Here, we have created two columns to fill with two frames. The first
frame is 200 pixels wide and will contain the navigation menu bar
implemented by menu.htm file. The second column fills in remaining
space and will contain the main part of the page and it is implemented
by main.htm file. For all the three links available in menu bar, we have
mentioned target frame as main_page, so whenever you click any of the
links in menu bar, available link will open in main page.

Following is the content of menu.htm file

20
<html>
<body bgcolor = "#4a7d49">
<a href = "http://www.google.com" target =
"main_page">Google</a>
<br />
<br />
<a href = "http://www.microsoft.com" target =
"main_page">Microsoft</a>
<br />
<br />
<a href = "http://news.bbc.co.uk" target = "main_page">BBC
News</a>
</body>
</html>

Following is the content of main.htm file −

21
 <html>
<body bgcolor = "#b5dcb3">
<h3>This is main page and content from any link will be displayed
here.</h3>
<p>So now click any link and see the result.</p>
</body>
</html>

HTML Forms
22
  The <input> Element

The <input> element is the most important form element.

The <input> element can be displayed in several ways, depending on the

type attribute.

Here are some examples:

Type Description
<input type="text"> Defines a one-line text input field
Defines a radio button (for selecting one of many
<input type="radio">
choices)
<input
Defines a submit button (for submitting the form)
type="submit">

 Text Input

<input type="text"> defines a one-line input field for text input:

Example
<form>
 Firstname:<br>
 <input type="text" name="firstname"><br>
  Last name:<br>
  <input type="text" name="lastname">
</form>

This is how it will look like in a browser:

23
First name:

Last name:

 Radio Button Input

<input type="radio"> defines a radio button.

Radio buttons let a user select ONE of a limited number of choices:

Example
<form>
  <input type="radio" name="gender" value="male" checked> Male<br>
  <input type="radio" name="gender" value="female"> Female<br>
  <input type="radio" name="gender" value="other"> Other
</form>

This is how the HTML code above will be displayed in a browser:

Male
Female
Other

 The Submit Button

<input type="submit"> defines a button for submitting the form data to

a form-handler.

24
The form-handler is typically a server page with a script for processing
input data.

The form-handler is specified in the form's action attribute:

Example
<form action="/action_page.php">
  First name:<br>
  <input type="text" name="firstname" value="Mickey"><br>
  Last name:<br>
  <input type="text" name="lastname" value="Mouse"><br><br>
  <input type="submit" value="Submit">
</form>

This is how the HTML code above will be displayed in a browser:

First name:
Mickey

Last name:
Mouse

Q. Write the coding for inserting a table.

25
Q. Write the coding for inserting the table of production and sales table.

26
 Q.
Write
the
code of
hypertext reference.

27
Q. Write the code for making a frame.

28
Q. Write the code in HTML to demonstrate the use of order and un-order list.

29
Q. Write the code in HTML to change background Web Page.

30
Q. Write the code in HTML to demonstrate various formatting style

31
and insert an image in web page.

Q. Write the code in HTML to design a table with different style.

32
Q. Write the code for inserting the frame divided in 3 parts.

33
Q. Write the code in HTML to design a Sign Up Form.
34
Q. Write the code in HTML to design a web page for Purchase Order Form.

35
Q. Write the code in HTML to design a web page for Food Corner

36
Q. Write the code in HTML to design a web page for Online Reservation.

37
38
39
40
Q. Write the code in HTML to design a web page for various

Insurance Business.

41
42
43
44
45
Q. Write the code in HTML to design a web page for Online Shopping.

46
47
48
49
Q. Write the code in HTML to design a web page for Commercial Bank.

50
51
52
53