E-COMMERCE LAB

BBA(B&I)311

SE
SSION- 2017-2020
BACHELOR OF BUSINESS ADMINISTRATION (BANKING AND
INSURANCE)
5TH SEMESTER, 1ST SHIFT

SUBMITTED TO : SUBMITTED BY:

MRS.PRIYANKA DHAKA FARDEEN TANTRAY
Assistant professor 41714901817
(Dept. of Business
Administration )

MAHARAJA SURAJMAL INSTITUTE

Affiliated to Guru Gobind Singh Indraprastha University
C-4, Lal Sain Mandir Marg, Janakpuri
 INDEX
S,NO EXPERIMENT PAGE DATE T.SIGN
NO.
1. Create a HTML file for displaying a
webpage with following Tags. The file
should contain a brief description about
all these tags:
a) Bold
b) Italics
c) Underline
d) Alignment
e) Paragraph
f) Text color
g) Headings
h) Hr
i) Background Color
j) Line Break
k) Pre

2. Design a web page of your CV with

headings as Objective, educational
qualification, achievements, strengths,
hobbies and personal details
Apply following specifications:
Insert a horizontal line after every above
mentioned heading. Set any light color as
page background. Bold and underline
every heading. Insert your image on the
left side of the web page. Use heading tag
to specify the heading. After every
heading is over put a horizontal line. Use
pre tag for educational qualification. Use
base font tag for all the text.
3. Design a web site with the name as
HTML Tutorial with following
specifications:
Make following hyperlinks:
Formatting Styles and Headings: include
Bold, italics, underline, strike, subscript,
superscript and all six types of headings
Font styles and images: Font and basefont
tags, image tags
Anchor: internal(linking within page) and
External (linking with other document
links)
Marquee: move text , image and
hyperlink
Other tags: hr, br, pre,p
Include following specifications:
In all these web pages only mention about
use, attributes apply them
Insert a background image on home page.
Make all the topics as hyperlinks and go
to some other page for description
Insert a Marquee showing HTML
Tutorial as moving text.
Use different font styles for different
topics
On every page, make a hyperlink for
going back to home page.

4. Q4)Write a Html code to print the

following lines in same manner
In Mathematics, A Quadratic equation is a polynomial equation the second degree.The general form is
ax2+bx+c=0
Where !=0(for if a=0,the equation becomes a linear equation)

“CHEMICAL EQUATION”
4H3PO3=3H3PO4+PH3
and other expression as
Pnew=Pold+X2-Yacosx

5. Create a nested list as follows:

Computer System
 1.Input Devices
Keyboard
I.
Mouse
II.
Joystick
III.
Scanner
IV.
a) Flat Bed Scanner
b) Hand Held Scanner
2.Output Devices
Monitor
I.
a) LCD
b) CRT
Printer
II.
a) Impact Printer
b) Non Impact Printer
Apply following parts:
Insert an image of computer on top right corner of the
web page
Display a marquee displaying ”Input and Output
Devices”
Use different font styles and colors for input and output
devices
Insert a horizontal line after input devices are over
Use bold ,italics, underline in headings

6. Create a HTML webpage which displays the following

list:
FRUITS & VEGETABLEES

A.Vegetables
 Onion
 Tomato
 Radish
 Potato
  Carrot

B. Fruits
 Apple

 Banana

 Water-melon

 Mango

 Grapes
Newspaper and Magazine
Newspaper
o
1. The Times Of India
2. Hindustan Times
3. Navbharat Times
4. Punjab Kesari
5. Dainik Jagran
Magazine
o
Business Times
I.
The Week
II.
India Today
III.
Harvard Business Review
IV.
Computer World
V.
Apply following parts
Put horizontal line after Newspaper and
Magazine
Apply heading tag for newspaper and magazine
Apply background color
Insert marquee tag displaying “Newspaper and
Magazines”

7. Design the following table as follows-

S.NO Name Course Marks

1. Ajay BBA 78
 Kumar

2. Kavita BCA 62
Sharma

3. Rohit Garg BBA CAM 87

4. Pooja BBA 67
Kapoor

5. Mohit BBA CAM 72

Gupta
Create the following table;

8. ROLL NO. NAME COURSE MARKS

INTERNAL EXTERNAL

TOTAL

123 abc BBA 20 60

80

789 xyz BCA 15 65

80

9. Design the following HTML form;

9A. Design the following HTML form;

10. Design the following frame:
MAIN MENU Explanation

Lists
Tables
Frames

- - -----------
- ------------
View Example

Example
 EXPERIMENT 1
Q1) Create a HTML file for displaying a webpage with following Tags. The file
should contain a brief description about all these tags:
a) Bold
b) Italics
c) Underline
d) Alignment
e) Paragraph
f) Text color
g) Headings
h) Hr
i) Background Color
j) Line Break
k) Pre
Answer-
<HTML>
<head>
<title>Program1</title>
</head>
<body>
Bold tag-It is used to bold the text.For example<b>Maharaja Surajmal
Institute</b><br/>
Italics tag-It is used to define the text in italics.For example<i>Maharaja
Surajmal Institute</i><br/>
Underline tag-It is used to underline the text.For example<u> Maharaja
Surajmal Institute</u><br/>
Alignment tag-It is used to align the text in either left,right or center.For
exmaple<p align="right">Maharaja Surajmal Institute</p><br/>
Paragraph tag-It is defined with P tag.For example<P>Maharaja Surajmal
Institute is accredited with GGSIPU.</P><br/>
Text color-It is used to color the text. For example<font color="red">Mahraja
Surajmal Institue</font><br/>
Heading-It is used to define heading in the html document.For examples<h1>e-
commerce</h1><h2>human resource management</h2><h3>income
tax</h3><h4>mallika sareen</h4><h5>business
communication</h5><h6>bba</h6>
Horizontal line-It is used to highlight the text.For example-HUMAN
RESOURCE MANAGEMENT<hr/>
Background color-It is used to define the background color of the text.For
example<h1 Style="Background-color:green;">e-coomerce</h1><br/>
Line break-It is used to break a line in the document. For example-Maharaja
surajmal institute is associated with GGSIPU.<br/>It offers various
undergraduate courses.<br/>
Pre tag-It defines the pre formating text. For example<pre>Maharaja Surajmal
Institute</pre>
</body>
</HTML>
 EXPERIMENT 2

Q2) Design a web page of your CV with headings as Objective, educational

qualification, achievements, strengths, hobbies and personal details
Apply following specifications:
Insert a horizontal line after every above mentioned heading. Set any light color
as page background. Bold and underline every heading. Insert your image on
the left side of the web page. Use heading tag to specify the heading. After
every heading is over put a horizontal line. Use pre tag for educational
qualification. Use base font tag for all the text.
ANSWER
<HTML>
<head>
<title>Program2</title>
</head>
<body>
<body style="background-color:pink;">
<h1>CV</h1>
<b><u>NAME</b></u><hr/><basefont="ARIAL">MALLIKA
SAREEN</basefont><br/>
<img src="quicksquarenew_201991182012910.jpg"alt="my picture"
align="right"width="90" height="90">
<b><u>FATHER'S NAME</b></u><hr/><basefont="ARIAL">SURESH
SAREEN</basefont><br/>
<b><u>DATE OF
BIRTH</b></u><hr/><basefont="ARIAL">27.12.1998</basefont><br/>
<b><u>CONTACT
NUMBER</b></u><hr/><basefont="ARIAL">9650037949</basefont><br/>
<b><u>OBJECTIVES</b></u><hr/><basefont="ARIAL">To fulfil the
policies and procedures of the organisation.</basefont><hr/><br/>
<b><u><pre>EDUCATIONAL
QUALIFICATION</pre></u><b/><hr/><basefont="ARIAL">10th=8.6
CGPA,12th=86.5%,BBA(B&I)=8.83 CGPA</basefont><br/>
<b><u>HOBBIES</b></u><hr/><basefont="ARIAL">singing and
dancing</basefont><br/>
<b><u>STRENGTHS</b></u><hr/><basefont="ARIAL">Leadership
qualities,communication skills</basefont><br/>
<b><u>ACHIEVEMENTS</b></u><hr/><basefont="ARIAL">Won prizes in
various singing competetions</basefont><br/>
</body>
</HTML>
 EXPERIMENT 3

Q3) Design a web site with the name as HTML Tutorial with following
specifications:
Make following hyperlinks:
Formatting Styles and Headings: include Bold, italics, underline, strike,
subscript, superscript and all six types of headings
Font styles and images: Font and basefont tags, image tags
Anchor: internal(linking within page) and External (linking with other
document links)
Marquee: move text , image and hyperlink
Other tags: hr, br, pre,p
Include following specifications:
In all these web pages only mention about use, attributes apply them
Insert a background image on home page.
Make all the topics as hyperlinks and go to some other page for description
Insert a Marquee showing HTML Tutorial as moving text.
Use different font styles for different topics
On every page, make a hyperlink for going back to home page.
ANSWER
<HTML>
<head>
<title>Program3</title>
</head>
<body>
<body background="picturewebsite.jpg">
<h1><marquee>HTML TUTORIAL</marquee></h1>
<a
href="https://www.w3schools.com/html/html_styles.asp"><basefont="arial">F
ont styles</basefont></a><br/>
<a
href="https://www.w3schools.com/html/html_headings.asp"><basefont="calibr
i">Headings</basefont></a><br/>
<a
href="https://www.w3schools.com/html/html_formatting.asp"><basefont="time
s now roman">Formatting styles</basefont></a><br/>
<a
href="https://www.w3schools.com/html/html_images.asp"><basefont="verdana
">images</basefont></a><br/>
<a
href="https://www.w3schools.com/html/html_links.asp><basefont="cambria">l
inks</basefont></a ><br/>
<a href="https://www.w3docs.com/learn-html/html-marquee-
tag.html><basefont="impact">marquee</basefont></a><br/>
<a
href="https://www.w3schools.com/tags/ref_byfunc.asp><basefont="century">o
ther tags</basefont></a><br/>
</body>
</HTML>
 EXPERIMENT 4
Q4)Write a Html code to print the following lines in same manner
In Mathematics, A Quadratic equation is a polynomial equation the second degree.The general form is
ax2+bx+c=0
Where !=0(for if a=0,the equation becomes a linear equation)

“CHEMICAL EQUATION”
4H3PO3=3H3PO4+PH3
and other expression as
Pnew=Pold+X2-Yacosx

ANSWER
<HTML>

<head>

<title>Frame1</title>

</head>

<body>

In Mathematics, A Quadratic equation is a polynomial equation the second degree.The general form is<br/>

<p align="center">ax2+bx+c=0</p>

Where !=0(for if a=0,the equation becomes a linear equation)

</body>

</HTML>

<HTML>

<head>

<title>frame2</title>

</head>

<body>

<q><u>CHEMICAL EQUATION</q></u><br/>

<br/>

4H3PO3=3H3PO4+PH3<br/>

and other expression as<br/>

Pnew=Pold+X2-Yacosx

</body>

</HTML>

<HTML>

<head>

<title>Program4(2)</title>

</head>

<frameset rows="30%,70%">

<frame src="Frame1.html">

<frame src="frame2.html">
</frameset>

</HTML>

OR

<html>

<head>

<title> Program4 </title>

</head>

<body>

<table border = "10px" cell padding = "12px" align = "center" >

<tr>

<th align = "left">IN MATHEMATICS,A QUADRATUC EQUATION IS A POLYNOMIAL EQUATION

THE SECOND DEGREE.THE GENERAL FORM IS

<BR/>

<P ALIGN="CENTER">Ax2 +bx+c = 0</p>

WHERE!=0FOR IF a=0, THE EQUATION BECOMES A LINEAR EQUATION</th></tr>

<tr>

<th align = "left"><Q><U>CHEMICAL REACTION</U></Q><br/>

<br/>

4H3PO3 = 3H3PO4+PH3<BR/>

AND OTHER EXPRESSION AS<BR/>

PNEW = POLD +X2-YACOSX </th></tr>

</table>

</body>

</html>
 EXPERIMENT 5

Q5) Create a nested list as follows:

Computer System

1.Input Devices

Keyboard
V.
Mouse
VI.
Joystick
VII.
Scanner
VIII.
c) Flat Bed Scanner
d) Hand Held Scanner
2.Output Devices

Monitor
III.
c) LCD
d) CRT
Printer
IV.
c) Impact Printer
d) Non Impact Printer
Apply following parts:

Insert an image of computer on top right corner of the web page

Display a marquee displaying ”Input and Output Devices”

Use different font styles and colors for input and output devices

Insert a horizontal line after input devices are over

Use bold ,italics, underline in headings

ANSWER

<HTML>

<head>

<tiltle>Program5</title>

</head>

<body>

<marquee>INPUT AND OUTPUT DEVICES</marquee>

<img src="comuter.jpg" alt="computer" align="right" height="42" width="42">

<h1>COMPUTER SYSTEM</h1>

<h2><b><basefont="arial"><font color="red">INPUT DEVICES</font></basefont></b></h2>

<ul>

<ol type="i">

<li>Keyboard</li>

<li>Mouse</li>

<li>Joystick</li>

<li>Scanner</li>

<ol type="a">

<li>Flat Bed Scanner</li>

<li>Hand Held Scanner</li>

</ol>
</ol>

<hr/>

<h2><b><basefont="Calibri"><font color="blue">OUTPUT DEVICES</font></basefont></b></h2>

<ul>

<ol type="i">

<li>Monitor</li>

<ol type="a">

<li>LCD</li>

<li>CRT</li>

</ol>

<li>Printer</li>

<ol type="a">

<li>Impact Printer</li>

<li>Non Impact Printer</li>

</ol>

</ol>

</ul>

</body>

</HTML>
 EXPERIMENT 6

Q6) Create a HTML webpage which displays the following list:

FRUITS & VEGETABLEES

C. Vegetables
 Onion
 Tomato
 Radish
 Potato
 Carrot
D.Fruits
 Apple
 Banana
 Water-melon
 Mango
 Grapes
Newspaper and Magazine

Newspaper
o
6. The Times Of India
7. Hindustan Times
8. Navbharat Times
9. Punjab Kesari
Dainik Jagran
10.
Magazine
o
Business Times
VI.
The Week
VII.
India Today
VIII.
Harvard Business Review
IX.
 Computer World
X.

Apply following parts

Put horizontal line after Newspaper and Magazine

Apply heading tag for newspaper and magazine

Apply background color

Insert marquee tag displaying “Newspaper and Magazines”

ANSWER

<html>

<head>

<title>Program6</title>

</head>

<body style="background-color:powderblue;">

<h2>FRUITS AND VEGETABLES</h2>

<ul>

<ol type="A">

<li>Vegetables</li>

<ol style="list-style-type:disc;">

<li>Onion</li>

<li>Tomato</li>

<li>Radish</li>

<li>Potato</li>

<li>Carrot</li>
 </ol>

<li>Fruits</li>

<ol style="list-style-type:disc;">

<li>Apple</li>

<li>Banana</li>

<li>Water-Melon</li>

<li>Mango</li>

<li>Grapes</li>

</ol>

</ul>

<h2><marquee>NEWSPAPERS AND MAGAZINES</marquee></h2><hr/>

<ul style="list-style-type:circle;">

<li>Newspaper</li>

<ol type="1">

<li>Times Of India</li>

<li>Hindustan Times</li>

<li>Navbharat Times</li>

<li>Punjab Kesari</li>

<li>Dainik Jagran</li>

</ol>

<li>Magazine</li>

<ol type="i">

<li>Business Times</li>
 <li>The Week</li>

<li>India Today</li>

<li>Harvard Business Review</li>

<li>Computer World</li>

</ol>

</ul>

</li>

</body>

</html>
 EXPERIMENT 7

Q 7) Design tables as follows-

Serial No. Name Course Marks

1 Ajay Kumar BBA 78

2 Kavita Sharma BCA 62

3 Rohit Garg BBA CAM 87

4 Pooja Kapoor BBA 67

5 Mohit Gupta BBA CAM 72

ANSWER

<HTML>

<head>

<title>Prgram7</title>

<body>

<table border="12px">

<tr>

<th>Seroal Number</th>

<th>Name</th>

<th>Course</th>

<th>Marks</th>

</tr>

<tr>

<td>1</td>
<td>Ajay Kumar</td>

<td>BBA</td>

<td>78</td>

</tr>

<tr>

<td>2</td>

<td>Kavita Shrma</td>

<td>BCA</td>

<td>62</td>

</tr>

<tr>

<td>3</td>

<td>Rohit Garg</td>

<td>BBA CAM</td>

<td>87</td>

</tr>

<tr>

<td>4</td>

<td>Pooja Kapoor</td>

<td>BBA</td>

<td>67</td>

</tr>

<tr>
<td>5</td>

<td>Mohit Gupta</td>

<td>BBA CAM</td>

<td>72</td>

</tr>

</table>

</body>

</HTML>
 EXPERIMENT 8

Q8) Create the following table;

ROLL NO. NAME COURSE MARKS

INTERNAL EXTERNAL TOTAL

123 abc BBA 20 60 80

789 xyz BCA 15 65 80

ANSWER

<HTML>

<head>

<title>Program8</title>

</head>

<body>

<table border="12px">

<tr>

<th rowspan="2" width="50px">Roll NO.</th>

<th rowspan="2">Name</th>

<th rowspan="2" >Course</th>

<th colspan="3">Marks</th>

</tr>

<tr>

<th>Internal</th>

<th>External</th>

<th>Total</th>

</tr>

<tr>
<td>123</td>

<td>abc</td>

<td>BBA</td>

<td>20</td>

<td>60</td>

<td>80</td>

</tr>

<tr>

<td>789</td>

<td>xyz</td>

<td>BCA</td>

<td>15</td>

<td>65</td>

<td>80</td>

</tr>

</table>

</body>

</HTML>
 EXPERIMENT 9

Q9) Design following HTML form:

ANSWER

<HTML>

<head>

<title>Program9</title>

</head>

<body>

<h1>Employee Form</h1>

<form>

NAME<Input type="text" name="textname" Maxlength="8" placeholder="max 8 character"><br/>

DESIGNATION<Select Name="Designation">

<Option Value="Manager">MANAGER

<Option Value="Employee">EMPLOYEE

</Select><br/>
SALARY<Input type="Number">Pwd<br/>

SPECIALISATION<Input type="RADIO" name="RADIO">IT<br/>

<Input type="RADIO" name="RADIO">MANAGEMENT<br/>

HOBBIES<Input type="CHECKBOX" name="CHECKBOX">TRAVELLING<br/>

<Input type="CHECKBOX" name="CHECKBOX">SPORTS<br/>

<Input type="CHECKBOX" name="CHECKBOX">READING<br/>

<Input type="CHECKBOX" name="CHECKBOX">NET SURFING<br/>

ADDRESS<TEXTAREA PLACEHOLDER="Please enter your address" rows="2" cols="30" ></TEXTAREA><br/>

SUBMIT<Input type="submit" value="submit"><br/>

RESET<Input type="reset" name="reset"><br/>

</form>

</body>

</HTML>

EXPERIMENT 9A
Q9A)
Design the following HTML form:

ANSWER

<HTML>

<head>

<title>Program9A</title>

</head>

<body style="background-color:powderblue;">

<form>

<h2>Personal Deatils</h2>

NAME<Input type="text" name="textname" maxlength="8" placeholder="max 8 character"><br/>

PASSWORD<Input type="password" name="password" maxlength="8" placeholder="max 8 character"><br/>

E-MAIL ID<Input type="text" name="e-mail"><br/>

GENDER Male<Input type="radio" name="radio"> Female<Input type="radio" name="radio"><br/>

CONTACT<Input type="number"><br/>

<h2>Educational Qualification</h2>

DEGREE<Select Name="Degree">

<Option Value="BBA">BBA

<Option Value="MBA">MBA

</Select><br/>

ENGINEERING<Select Name="Dngineering">

<Option Value="BTech">BTech

<Option Value="MTech">MTech

</Select><br/>

HOBBIES<Input type="CHECKBOX" name="CHECKBOX">Playing chess <Input type="CHECKBOX"

name="CHECKBOX">Reading Books<br/>

<h2>ADDRESS</h2>

<TEXTAREA PLACEHOLDER="Please enter your address" rows="5" cols="30" ></TEXTAREA><br/>

Attach file<Input type="file" name="choose file">no file chosen<br/>

SUBMIT<Input type="submit" value="submit"><br/>

</form>

</body>

</HTML>
 EXPERIMENT 10

Q10) Design the following frame:

MAIN MENU Explanation

Lists
Tables
Frames

- - -----------
- ------------
View Example

Example

ANSWER

<HTML>

<head>

<title>FRAME</title>

</head>

<frameset cols="50%,50%">

<frame src="Main Menu.html" name="o1">

<frameset rows="60%,40%">

<frame src="Explanation.html" name="o2">Explanation

<frame src="Example.html" name="o3">

</frameset>

</frameset>

</HTML>
<HTML>

<head>

<title>MAIN MENU</title>

<body>

<h1>MAIN MENU</h1><br/><br/><br/>

<font size="6">

<a href="Lists.html" target="o2">Lists</a><br/><br/>

<a href="Tables.html" target="o2">Tables</a><br/><br/>

<a href="Frames.html" target="o2">Frames</a><br/><br/>

</font>

</body>

<HTML>

<HTML>

<head>

<title>EXPLANATION</title>

<head>

<body>

<font size="5">

<h2>Explanation</h2>

<p>Understanding HTML Lists.HTML lists are used to prsent lists of information in well formed and semantic way.

There are three different types of lists in HTML and each one has a specific purpose and meaning:Unordered list-used to

group a set of related items,in no particular order</p>

<a href="Example of Lists.html" target="o3">View Example</a>

</font>

</body>

</HTML>

<HTML>

<head>

<title>EXAMPLE</title>

</head>

<body>

<font size="4">

<h3><u>EXAMPLE</u></h3>

<p>

<pre>

<ul>

<li>coffee</li>

<li>tea</li>

<li>milk</li>

</ul>

(one needs to open tag with <> this sign and close the tag with<br/></>this sign.)

</pre>

</p>

</font>

</body>

</HTML>
<HTML>

<head>

<title>LISTS</title>

<head>

<body>

<font size="5">

<h2>Explanation</h2>

<p>Understanding HTML Lists.HTML lists are used to prsent lists of information in well formed and semantic way.

There are three different types of lists in HTML and each one has a specific purpose and meaning:Unordered list-used to

group a set of related items,in no particular order</p>

<a href="Example of Lists.html" target="o3">View Example</a>

</font>

</body>

</HTML>

<HTML>

<head>

<title>TABLES</title>

<head>

<body>

<font size="5">

<h2>Explanation</h2>

<p>An HTML structure for creating rows and columns on a Web page.
The Table tag defines the overall table and the Table Row(TR) is used to build each row.The Table Data(TD) tag defines

the actual data.Prior to HTML5,tables were often used for virtually every element on the page.</p>

<a href="Example of Tables.html" target="o3">View Example</a>

</font>

</body>

</HTML>

<HTML>

<head>

<title>FRAMES</title>

<head>

<body>

<font size="5">

<h2>Explanation</h2>

<p>HTML-Frames.HTML frames are used to divide your browser window into multiple sections where each section can

load a seperate HTML document.

A collection of frames in the browser window is known as frameset.The window is divided into frames in a similar way

the tables are organised:into rows and columns</p>

<a href="Example of Frames.html" target="o3">View Example</a>

</font>

</body>

</HTML>

<HTML>

<head>

<title>EOL</title>
</head>

<body>

<font size="4">

<h3><u>EXAMPLE</u></h3>

<p>

<pre>

<ul>

<li>coffee</li>

<li>tea</li>

<li>milk</li>

</ul>

(one needs to open tag with <> this sign and close the tag with<br/></>this sign.)

</pre>

</p>

</font>

</body>

</HTML>

<HTML>

<head>

<title>EOT</title>

</head>

<body>

<font size="4">

<h3><u>EXAMPLE</u></h3>
<p>

<pre>

<table style="width 100%">

<tr>

<th>firstname</th>

<th>lastname</th>

<th>age</th>

</tr>

<tr>

<td>Tom</td>

<td>Smith</td>

<td>50</td>

</tr>

<tr>

<td>Eva</td>

<td>Jackson</td>

<td>94</td>

</tr>

</table>

(one needs to open tag with <> this sign and close the tag with<br/></>this sign.)

</pre>

</p>

</font>

</body>

</HTML>
<HTML>

<head>

<title>EOF</title>

</head>

<body>

<font size="4">

<h3><u>EXAMPLE</u></h3>

<p>

<pre>

<frameset cols="25%,25%">

<frame src="frame_a.html">

<frame src="frame_b.html">

<frame src="frame_c.html">

</frameset>

(one needs to open tag with <> this sign and close the tag with<br/></>this sign.)

</pre>

</p>

</font>

</body>

</HTML>