E-COMMERCE PRACTICAL FILE
(BBA-108)
SUBMITTED IN PARTIAL FULFILLMENT FOR THE AWARD OF
THE DEGREE OFBACHELORS OF BUSINESS ADMINISTRATION
AFFILIATED TO
GURU GOBIND SINGH INDRAPRASTHA UNIVERSITY, DELHI
Submitted To: - Submitted By: -
Dr. Deepika Joshi APOORV ANAND (BBAE2C)
ENROLLMENT NO.- 12580001721
GITARATTAN INTERNATIONAL BUSINESS SCHOOL
Madhuban Chowk, Outer Ring, Block D, Sector 14, Rohini, Delhi, 110085
1|Page
Certificate
This is to certify that "Apoorv
Anand" student of class E2C SEM2
"BBA" has successfully completed
their E-Commerce Project file on
"HTML Codings" under the guidance
of Dr. Deepika Joshi ma’am.
2|Page
S.NO. TOPIC OF PRCTICAL PAGE SIGNATURE
NO.
P1 Create a webpage in HTML which 4-5
has Your College Name as
heading and add the text
regarding it & make the use of
Quotation and Citation Elements
& save the file with your name
P2 Create a webpage in HTML to 6-7
show all the types of heading tags
and use Comment Tag to describe
them.
P3 Create a static web page which 8-9
defines all text formatting tags of
HTML and briefly explain all the
tags.
P4 Create your resume using HTML 10-12
tags and include superscript,
subscript tags and mono spaced
Font in it.
P5 Create a static webpage using 13-14
table tags of HTML and explain all
the attributes define under Table
Tag.
P6 Create three HTML files named 15-16
1.html, 2.html and 3.html and link
them together to each other and
put the appropriate content in
each file.
P7 Create a webpage which defines 17-18
different empty tags.
P8 Create webpage to include 19-22
multimedia tags and explain each
tag with its syntax.
3|Page
P9 Create employee registration 23-27
webpage using HTML form
objects.
P10 Create a table using Html Tags. 28-34
P11 Create a web page using frame 35
tag a) rows and columns b)
border and border color
P12 Explain all types of listing 36-37
available in Html with its syntax.
Create a webpage using list tags
of HTML.
P13 Write html code to show nested 38-39
list and attributes like reversed,
start and type.
P14 Create a html page to show 40-41
various body tag attributes like
background color, text color and
add scrolling text “read the
message”. Also add an image as a
link.
P15 Create a HTML webpage for your 42-43
college with three frames. The
first frame will be horizontal on
displaying the name and address
of the College. The second frame
which is vertical on left will list
the available Courses. The third
frame will be to the right of the
second frame and will display the
introduction to the College
4|Page
1. Create a webpage in HTML which has Your College Name as heading and add the text
regarding it & make the use of Quotation and Citation Elements & save the file with your
name.
INPUT:-
<html>
<head>
<title> Gitarattan international business school </title>
</head>
<body text = "green">
<h1 style = "background- color: powderblue"><center> Gitarattan International Business
School</center><h1>
<hr>
<blockquote cite="https://gitarattan.edu.in/index.html"> Gitarattan International Business
School was established in the year 2004
under the aeg is of Rohini Educational Society. The Society is proudly running
various other successful Institutions in Delhi like Gitarattan Institute of
Advanced Studies & Training, Gitarattan Jindal Public School & The Sovereign
School. These institutions are well known among all stakeholders for quality
education, decent infrastructure and location. These institutions are rated and
ranked very high by various regulatory bodies.
Gitarattan International Business School (GIBS) is affiliated to Guru Gobind Singh
Indraprastha University, Delhi and is approved by All India Council for Technical
Education (AICTE), Ministry of HRD, Government of India for Technical programmes
and Bar Council of India for Law programmes. The Institute is conducting programme
5|Page
like MBA, MBA (International Business), BBA (General), (Both First and Second
shift), BA LLB and BBA LLB.</blockquote>
</body>
</html>
2. Create a webpage in HTML to show all the types of heading tags and use
Comment Tag to describe them.
6|Page
INPUT:-
<html>
<head>
<body>
<h1> Gitarattan International Business School</h1>
<h2>Gitarattan International Business School</h2>
<h3>Gitarattan International Business School</h3>
<h4>Gitarattan International Business School</h4>
<h5>Gitarattan International Business School</h5>
<h6>Gitarattan International Business School</h6>
<!-- This is a comment -->
<p>Ranked as no. 49th in top 150 B Schools in India, 34th in Top 100 Private
Institutes in India and 19th in top 20 North B Schools for its MBA programme
by the TIMES B-SCHOOL Survey 2022</p>
</body>
7|Page
8|Page
3. Create a static web page which defines all text formatting tags of HTML and
briefly explain all the tags.
INPUT:-
<html>
<head>
<title>text formatting</title>
</head>
<body>
<h1>TEXT FORMATTING</h1>
<b>This text is bold</b>
<br>
<strong>This text is important!</strong>
<br>
<i>This text is italic</i>
<br>
<em>This text is emphasized</em>
<br>
<small>This is some smaller text.</small>
<br>
<p>Do not forget your <mark>english</mark> english book today.</p>
<p>This is <sup>superscripted</sup> text.</p>
<p>This is <sub>subscripted</sub> text.</p>
</body>
</html>
9|Page
Element Description
name
<b> This is a physical tag, which is used to bold the text written between it.
<strong> This is a logical tag, which tells the browser that the text is important.
<i> This is a physical tag which is used to make text italic.
<em> This is a logical tag which is used to display content in italic.
<mark> This tag is used to highlight text.
<u> This tag is used to underline text written between it.
<tt> This tag is used to appear a text in teletype. (not supported in HTML5)
<strike> This tag is used to draw a strikethrough on a section of text. (Not supported in
HTML5)
<sup> It displays the content slightly above the normal line.
<sub> It displays the content slightly below the normal line.
<del> This tag is used to display the deleted content.
10 | P a g e
<ins> This tag displays the content which is added
<big> This tag is used to increase the font size by one conventional unit.
<small> This tag is used to decrease the font size by one unit from base font size
4. Create your resume using HTML tags and include superscript, subscript tags and mono
spaced Font in it.
INPUT:-
<html>
<head>
<title> RESUME </title>
</head>
<body> <centers
<h1>
<u> MY RESUME </u>
</center>
<h3> Name - APOORV </h3>
<h5> Address: PRASHANT
11 | P a g e
VIHAR DELHI </H5>
<H5> EMAIL :[email protected] </H5> <H5> Contact no: 9968456956 </H5> <hr>
<h2 Style= "background-color: powderblue";>
<u> CAREER QUALIFICATION </U>
<H3> To succeed in an enviornment of growth and excellence and earn a job which provides
me job satisfaction and selfdevelopment and help re achive cars personal as well as
organizational goals</h3>
<h2 style="background-color: pouderblue";>
<u> ACADMIC QUALIFICATION </u>
</h2> <table border = 5 width=100> <tr>
<th> Qualification </th>
<th> Board/University</th>
<th> School/college</th>
<th> Year of passing</th> <th> Percentage </th>
</tr>
<tr>
<th> BBA </th>
<th> GGSIPU </th>
<th> GIBS </th>
<th> 2024 </th>
</tr> | <tr>
<th> 12<sup>th</th> <th> CBSE </th>
<th> SDPS </th>
12 | P a g e
<th> 2021 </th>
<th> 89% </th>
</tr> <tr>
<th> 10<sup>th</th>
<th> CBSE </th>
<th> SDPS </th> <th> 2019 </th>
<th> 83% </th>
</tr>
</table>
<h2>
<u style="background-color: powderblue";> STRENGHT </u> <br> </h2>
<ul>
<b>
<h3>
<li> Good Communication and Inter-personal skill </li>
<li> Focused and Confident with positive attitude </li>
<li> Good team player </li>
<li> Self Motivated</li>
<h3>
<b>
</ul>
</body>
13 | P a g e
</html>
5. Create a static webpage using table tags of HTML and explain all the attributes define
under Table Tag.
INPUT:-
<html>
<head><title>table</title>
<style>
table,th,td {border: 1px solid black;}
th{background-color : white;}
td {background-color :pink;}</style></head>
<body>
14 | P a g e
<h2><center><b>TABLE<b></center></h2>
<table align="center" width="50%" height="300" border="2">
<tr><th><font size=4>CITY</th>
<td><center><font size=3><b>Delhi </td>
<td><center><font size=3><b>Maharashtra </td>
<td><center><font size=3><b>Rajasthan</td>
<td><center><font size=3><b>West bengal</td>
<td><center><font size=3><b>Bihar</td>
<td><center><font size=3><b>goa</td>
</tr>
<tr><th><font size=4>TEMPERATURE</th>
<td><center><font size=3><b>40 </td>
<td><center><font size=3><b>34 </td>
<td><center><font size=3><b>41</td>
<td><center><font size=3><b>40</td>
<td><center><font size=3><b>42</td>
<td><center><font size=3><b>39</td>
</tr>
<tr><th><font size=4>DIRECTION</th>
15 | P a g e
6. Create three HTML files named 1.html, 2.html and 3.html and link them
together to each other and put the appropriate content in each file .
INPUT;-
<html>
<body>
<a href="file:/// C:\Users\anand\OneDrive"> Go to Page 1 </a> <br>
<a href="file:/// C:\Users\anand\OneDrive\Desktop"> Go to Page 2
</a> <br>
16 | P a g e
<a href="file:/// C:\Users\anand\OneDrive\Desktop"> Go to Page 3
</a>
</body>
</html>
17 | P a g e
7. Create a webpage which defines different empty tags.
INPUT:-
<html>
<head><title>empty tags</title></head>
<body bgcolor="palevioletred">
<body text="black">
<h1><b>WHAT IS AN EMPTY TAG? </h1>
<h3>An empty element is a component that doesn’t have any embedded elements
or text elements. Empty elements do not have successor nodes. In other words, the tags
that do not contain any closing tags are empty tags. Empty tags contain only the opening tag
but they perform some action in the webpage. </h3>
<h2><u>LIST OF EMPTY TAGS IN HTML</u></h2>
<h2><u><li>AREA</li></u></h2><h3>It is used to map a portion of an image to make it clickable by the
end-user. It is used to direct the user to different links after the user
clicks on the mapped portions of the image. </h3>
<h2><u><li>BASE</li></u></h2><h3>For all relative URLs in a document, the base URL is specified to
use with the base element. Only one base element can be used in
a document. </h3>
<h2><u><li>BR</li></u></h2><h3>The br element is used for a line break in a text (can also be called
carriage-return). It is useful in the case of writing an address, story, blogs,
etc where the long sentence needs to break for clear visibility.</h3>
<h2><u><li>COL</li></u></h2><h3>The col tag in HTML is used to set the column properties for each
column within a colgroup tag. This tag is used to set the style property to
each column. This tag does not contain closing tags.</h3>
<h2><u><li>HR</li></u></h2><h3>A thematic break between paragraph-level components is
represented by the hr element. For instance, a change of shift in the topic within a
section.</h3>
<h2><u><li>IMG</li></u></h2><h3>The img element is used to embed an image into the
document.</h3>
<h2><u><li>INPUT</li></u></h2><h3>This empty element is used to create interactive controls for
web-based applications and forms, for accepting the information from the
user such as an address, name, phone number, etc, depending on a variety of types of input data and
control widgets are available. All the input types and attributes are used inside
18 | P a g e
the input element.</h3>
<h2><u><li>LINK</li></u></h2><h3>The HTML element link is used to establish a connection between
the current content and an external resource. For instance, we can use it to link
the external stylesheet or javascript file, etc.</h3>
<h2><u><li>META</li></u></h2><h3>The meta HTML element represents metadata i.e., information of
a information.</h3>
<h2><u><li>SOURCE</li></u></h2><h3>The source element is an empty element that provides various
media resources for the image, audio, or video elements. It provides the
same media material in several file formats to ensure compatibility with a wide variety of browsers, as
image and media file formats are supported by the browsers differently.</h3>
</body>
</html>
19 | P a g e
8. Create webpage to include multimedia tags and explain each tag with
its syntax
<html>
<head>
<title>multimedia tags</title>
</head>
<body bgcolor="yellow">
<h1><b><center>MULTIMEDIA TAGS</center></b></h1>
<h2>IMAGE TAG</h2>
<h3><p>The img tag is used to embed an image in an HTML page.<br>
Images are not technically inserted into a web page; images are linked
to web pages. The img tag creates a holding space for the referenced
image.<br>
The img tag has two required attributes:<br>
src - Specifies the path to the image<br>
alt - Specifies an alternate text for the image, if the image for some
reason cannot be displayed<br>
Note: Also, always specify the width and height of an image. If width
and height are not specified, the page might flicker while the image
loads.</h3><br>
20 | P a g e
<img
src="https://cache.careers360.mobi/media/presets/720X480/colleges/
social-media/media-gallery/6629/2022/2/17/GIBS_9.JPG"
height="300" width="400"<br>
<h2>AUDIO TAG</h2>
<h3><p>The audio tag is used to embed sound content in a document,
such as music or other audio streams.<br>
The audio tag contains one or more source tags with different audio
sources. The browser will choose the first source it supports.<br>
The text between the audio and audio tags will only be displayed in
browsers that do not support the audio element.<br>
There are three supported audio formats in HTML: MP3, WAV, and
OGG.</p></h3>
<audio controls>
<source src="C:\Users\anand\OneDrive\Desktop\Juice-WRLD-Lucid-
Dreams-Mybestfeelings.com_.mp3"></audio><br>
<h2>VIDEO TAG</h2>
<h3><p>The video tag is used to embed video content in a document,
such as a movie clip or other video streams.<br>
The video tag contains one or more source tags with different video
sources. The browser will choose the first source it supports.<br>
The text between the video and video tags will only be displayed in
browsers that do not support the video element.<br>
21 | P a g e
There are three supported video formats in HTML: MP4, WebM, and
OGG.</p></h3>
<video width="320" height="240" controls>
<source src="C:\Users\anand\Downloads\Martin Garrix & Bonn — High
On Life.mp4">
</body>
</html>
22 | P a g e
9. Create employee registration webpage using HTML form objects
INPUT:-
<html>
<body>
<Center>
<Font size=”+3″ color=red>Employee Registration Form</font>
<form method=post action=”prac.html”>
<table>
<tr>
<td></td>
<td><input type=radio name=initial checked>Mr.
<input type=radio name=initial>Mrs.
<input type=radio name=initial>Ms.</td>
</tr><tr>
<td>First Name</td>
<td><input type=text name=fn placeholder=”First Name”></td>
</tr><tr>
<td>Last Name</td>
<td><input type=text name=ln placeholder=”Last Name”></td>
23 | P a g e
</tr> <tr>
<td>Mail Address1</td>
<td><input type=text name=add1></td>
</tr><tr>
<td>Mail Address2</td>
<td><input type=text name=add2></td>
</tr><tr>
<td>City</td>
<td><input type=text name=ct></td>
</tr><tr>
<td>State</td>
<td><select name=state>
<option value=”Gujarat”>Gujarat
<option value=”Maharastra”>Maharastra
<option value=”Karnataka”>Karnataka
<option value=”Delhi”>Delhi
</select>
</td>
</tr><tr>
24 | P a g e
<td>Zip</td>
<td><input type=text name=zp></td>
</tr><tr>
<td>Upload Photo</td>
<td><input type=file name=photo></td>
</tr><tr>
<td>E-Mail</td>
<td><input type=text name=email size=30></td>
</tr><tr>
<td>Mobile</td>
<td><input type=text name=mob placeholder=”+91″></td>
</tr><tr>
<td>Languages known</td>
<td><input type=checkbox name=lk value=Gujarati
checked>Gujarati</td>
</tr><tr>
<td></td>
<td><input type=checkbox name=lk value=Hindi
25 | P a g e
checked>Hindi</td>
</tr><tr>
<td></td>
<td><input type=checkbox name=lk value=English
checked>English</td>
</tr><tr>
<td></td>
<td><input type=checkbox name=lk value=Marathi >Marathi</td>
</tr><tr>
<td>Additional Information</td>
<td><textarea name=add rows=3 cols=20 placeholder=”Optional”
wrap></textarea></td>
</tr><tr>
<td></td>
<td><input type=submit value=submit> <input type=reset
value=reset></td>
</table>
</form>
</body>
26 | P a g e
</html>
27 | P a g e
10. Create a table using Html Tags. For Instance:-
INPUT:-
<html>
<body>
<h1>TIME TABLE</h1>
<table border="5" cellspacing="0" align="center">
<!--<caption>Timetable</caption>-->
<tr>
<td align="center" height="50"
width="100"><br>
<b>Day/Period</b></br>
</td>
<td align="center" height="50"
width="100">
<b>I<br>9:30-10:20</b>
</td>
<td align="center" height="50"
width="100">
28 | P a g e
<b>II<br>10:20-11:10</b>
</td>
<td align="center" height="50"
width="100">
<b>III<br>11:10-12:00</b>
</td>
<td align="center" height="50"
width="100">
<b>12:00-12:40</b>
</td>
<td align="center" height="50"
width="100">
<b>IV<br>12:40-1:30</b>
</td>
<td align="center" height="50"
width="100">
<b>V<br>1:30-2:20</b>
</td>
<td align="center" height="50"
29 | P a g e
width="100">
<b>VI<br>2:20-3:10</b>
</td>
<td align="center" height="50"
width="100">
<b>VII<br>3:10-4:00</b>
</td>
</tr>
<tr>
<td align="center" height="50">
<b>Monday</b></td>
<td align="center" height="50">Eng</td>
<td align="center" height="50">Mat</td>
<td align="center" height="50">Che</td>
<td rowspan="6" align="center" height="50">
<h2>L<br>U<br>N<br>C<br>H</h2>
</td>
<td colspan="3" align="center"
height="50">LAB</td>
30 | P a g e
<td align="center" height="50">Phy</td>
</tr>
<tr>
<td align="center" height="50">
<b>Tuesday</b>
</td>
<td colspan="3" align="center"
height="50">LAB
</td>
<td align="center" height="50">Eng</td>
<td align="center" height="50">Che</td>
<td align="center" height="50">Mat</td>
<td align="center" height="50">SPORTS</td>
</tr>
<tr>
<td align="center" height="50">
<b>Wednesday</b>
</td>
<td align="center" height="50">Mat</td>
31 | P a g e
<td align="center" height="50">phy</td>
<td align="center" height="50">Eng</td>
<td align="center" height="50">Che</td>
<td colspan="3" align="center"
height="50">LIBRARY
</td>
</tr>
<tr>
<td align="center" height="50">
<b>Thursday</b>
</td>
<td align="center" height="50">Phy</td>
<td align="center" height="50">Eng</td>
<td align="center" height="50">Che</td>
<td colspan="3" align="center"
height="50">LAB
</td>
<td align="center" height="50">Mat</td>
</tr>
32 | P a g e
<tr>
<td align="center" height="50">
<b>Friday</b>
</td>
<td colspan="3" align="center"
height="50">LAB
</td>
<td align="center" height="50">Mat</td>
<td align="center" height="50">Che</td>
<td align="center" height="50">Eng</td>
<td align="center" height="50">Phy</td>
</tr>
<tr>
<td align="center" height="50">
<b>Saturday</b>
</td>
<td align="center" height="50">Eng</td>
<td align="center" height="50">Che</td>
<td align="center" height="50">Mat</td>
33 | P a g e
<td colspan="3" align="center"
height="50">SEMINAR
</td>
<td align="center" height="50">SPORTS</td>
</tr>
</table>
</body>
</html>
34 | P a g e
11. Create a web page using frame tag a) rows and columns b) border
and border color.
INPUT:-
<html>
<head>
<title>frame tag</title>
</head>
<frameset cols="45%,55%" " border="20" bordercolor="blue" >
<frame src="https://en.wikipedia.org/wiki/Economy_of_India">
<frame src="https://en.wikipedia.org/wiki/India">
</frameset>
</html>
35 | P a g e
12. Explain all types of listing available in Html with its syntax. Create a
webpage using list tags of HTML.
INPUT:-
<html>
<head><title>Nested list</title></head>
<body bgcolor="MistyRose">
<h1><center><u>Nested List</u></center></h1>
<h2><p> BBA First year's semesters:</p></h2>
<ul>
<h3><li>semester 1</li></h3>
36 | P a g e
<h4><ul>
<li>Financial Accounting and analysis</li>
<li>Business Maths</li>
<li>Business Economy</li>
<li>IT Applications in Business</li>
<li>Management process and organizational behaviour</li>
</ul></h4>
<ol>
<h3> <li>semester 2</li></h3>
<h4><ol>
<li>business -environment</li>
<li>decision techniques in business</li>
<li>cost accounting</li>
<li>E-commerce</li>
<li>Business communication</li>
</ol></h4>
</body>
</html>
37 | P a g e
13. Write html code to show nested list and attributes like reversed,
start and type.
INPUT:-
<html>
<head>
<body bgcolor="turquoise"
<h1 style="color:black">GIBS COLLEGE</H1>
<H2> NESTED ORDER LIST</H2>
<OL>
38 | P a g e
<Li>Accounts</li>
<li> Business
<ol>
<li> Business environment</li>
<li> Business studies</li>
</ol>
</li>
<li> Ecommerce</li>
</ol>
</body>
</html>
39 | P a g e
14. Create a html page to show various body tag attributes like
background color, text color and add scrolling text “read the message”.
Also add an image as a link.
40 | P a g e
INPUT:-
<html>
<head><title>body tag attribute</title></head>
<body bgcolor="YELLOW"
body text="neon">
<h2><marquee> "READ THE MESSEGE" </marquee></h2>
<p>image link:</p>
<a
href="https://akm-img-a-in.tosshub.com/indiatoday/images/story/202
007/
download__3_.jpeg?.qMoUgb5Y6rTrgZsQaKmwE._gYpJl0nX&size=770:
433"
target="_blank">https://akm-img-a-in.tosshub.com/indiatoday/
images/story/202007/
download__3_.jpeg?.qMoUgb5Y6rTrgZsQaKmwE._gYpJl0nX&size=770:
433</a>
</body>
41 | P a g e
</html>
15. Create a HTML webpage for your college with three frames. The first
frame will be horizontal on displaying the name and address of the
College. The second frame which is vertical on left will list the available
Courses. The third frame will be to the right of the second frame and will
display the introduction to the College.
<html>
<head>
<title> frame tags 15 </title>
42 | P a g e
</head>
<frameset rows="50%,50%">
<frame src="Cllg Address.html">
<frameset cols=45%,45%">
<frame src="Avail Courses.html">
<frame src="About Us.html">
</frameset>
</html>
43 | P a g e
44 | P a g e
