Scribd
Upload
9 views

Aadi

The document is a practical lab file for an E-Commerce course submitted by Aadi Jain for a BBA degree at GGSIPU, detailing various HTML experiments. It includes tasks such as designing web pages with formatting tags, lists, tables, images, hyperlinks, frames, forms, and multimedia components. The lab file serves as a record of the student's work and learning in web development.

Uploaded by

arorapriyanshi002
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
9 views

Aadi

The document is a practical lab file for an E-Commerce course submitted by Aadi Jain for a BBA degree at GGSIPU, detailing various HTML experiments. It includes tasks such as designing web pages with formatting tags, lists, tables, images, hyperlinks, frames, forms, and multimedia components. The lab file serves as a record of the student's work and learning in web development.

Uploaded by

arorapriyanshi002
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 27

Practical Lab File

of
E-Commerce Lab (BBA-114)

Submitted in partial fulfilment for the award of BBA degree of GGSIPU, New Delhi

Submitted by
Name: Aadi Jain
Roll No:06515601724
Semester: 2nd
Batch: 2024-28

Under the guidance of Mr. Faheem Ahmed, Assistant professor

DEPARTMENT OF MANAGEMENT

DR AKHILESH DAS GUPTA INSTITUTE OF PROFESSIONAL STUDIES


(Affiliated to GGSIPU)
FC-26, Shastri Park, Delhi-110053
INDEX
S.NO NAME OF EXPERIMENTS Signature
1 Design a web page by using html to implement the
different forma ng tags

2 Design a web page by using html to show the descrip on


of a book which includes its tle, author's name, publisher
name and year of publica on
3 Design a web page by using html to implement the
ordered list and unordered list
4 Design a web page by using html to implement the table
that contains record for 10
5 Design a web document by using html to implement the
different colours as background colour and text colours
6 Design a web page by using html to implement inser on
of image in web page and perform different forma ng on
it
7 Design a web document by using html to implement the
use of different types of icons
8 Design a web document by using html to implement
hyperlinks and its naviga on to different web pages

9 Design a web document by using html to implement


working with frames

10 Design a web document by using html to implement


working with frames

11 Prepare a resume in html with objec ves, educa on,


hobbies and extracurricular ac vi es

12 Design a web document to implement the use of


mul media components in web
Q1.Design a web page by using html to implement the different forma ng tags
<html>
<head>< tle>Forma ng Tags</ tle></head>
<body>
<h1><u>Welcome to BBA Web Class</u></h1>
<p><b>Bold Text</b>, <i>Italic Text</i>, <u>Underlined Text</u></p>
<p><strike>Strikethrough Text</strike> and <sup>Superscript</sup> and
<sub>Subscript</sub></p>
</body>
</html>
Q2 Design a web page by using html to show the descrip on of a book which
includes its tle, author's name, publisher name and year of publica on
<html>

<head>< tle>Book Descrip on</ tle></head>

<body>

<h2>Book Informa on</h2>

<p><b>Title:</b> Too Good to Be True</p>

<p><b>Author:</b> Prajakta Koli</p>

<p><b>Publisher:</b> HarperCollins India</p>

<p><b>Year:</b>January 13, 2025</p>

</body>

</html>
Q3 Design a web page by using html to implement the ordered list and
unordered list
<html>

<head>< tle>List Example</ tle></head>

<body>

<h2>Ordered List</h2>

<ol>

<li>Laptops </li>

<li>Hardisk</li>

<li>Pendrive</li>

</ol>

<h2>Unordered List</h2>

<ul>

<li>Keyboard </li>

<li>Table </li>

<li>Calculator</li>

</ul>

</body>

</html>
Q4 Design a web page by using html to implement the table that contains
record for 10

<html>

<head>< tle>Student Table</ tle></head>

<body>

<h2>Student Records</h2>

<table border="1">

<tr><th>Roll No</th><th>Name</th><th>Marks</th></tr>

<tr><td>1</td><td>Vidhi</td><td>85</td></tr>

<tr><td>2</td><td>Sagar </td><td>90</td></tr>

<tr><td>3</td><td>Mayank</td><td>80</td></tr>

<tr><td>4</td><td>Ansh</td><td>95</td></tr>

<tr><td>5</td><td>piyush</td><td>93</td></tr>

<tr><td>6</td><td>s=Kar k</td><td>75</td></tr>

<tr><td>7</td><td>anil</td><td>67</td></tr>

<tr><td>8</td><td>vinod</td><td>78</td></tr>

<tr><td>9</td><td>Neha</td><td>60</td></tr>

<tr><td>10</td><td>rohit</td><td>70</td></tr>

</table>

</body>

</html>
Q5Design a web document by using html to implement the different colours as
background colour and text colours
<html>

<head>< tle>Colours</ tle></head>

<body bgcolor="Red" text="black">

<h1>Welcome to Colourful Web Page</h1>

</body>

</html>
Q6 Design a web page by using html to implement inser on of image in web
page and perform different forma ng on it
<html>
<head>< tle>Image Example</ tle></head>
<body>
<h2>Our College Building</h2>
<img src="adgitm.jpg" alt="College Image" width="400" style="border: 2px
solid black;">
</body>
</html>
Q7Design a web document by using html to implement the use of different
types of icons
<html>
<head>< tle>Icons</ tle></head>
<body>
<h2>Social Media Icons</h2>
<img src="facebook-icon.png" alt="Facebook" width="40">
<img src="twi er-icon.png" alt="Twi er" width="40">
</body>
</html>
Q8 Design a web document by using html to implement hyperlinks and its naviga on to different
web pages

<html>

<head>< tle>Hyperlinks</ tle></head>

<body>

<a href="h ps://www.google.com">Visit Google</a><br>

<a href="about.html">About Us</a>

</body>

</html>
Q9 Design a web document by u*sing html to implement working with frames

1. Main HTML Page (index.html)

html

CopyEdit

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

< tle>Modern Framed Layout</ tle>

<style>

body, html {

margin: 0;

height: 100%;

font-family: Arial, sans-serif;

header {

background-color: #4CAF50;

color: white;

padding: 15px;

text-align: center;

font-size: 24px;

.container {

display: flex;

height: calc(100% - 60px);

nav {

width: 200px;
background-color: #f0f0f0;

padding: 15px;

box-sizing: border-box;

nav a {

display: block;

margin: 10px 0;

color: #333;

text-decora on: none;

nav a:hover {

color: #4CAF50;

iframe {

flex-grow: 1;

border: none;

</style>

</head>

<body>

<header>

Welcome to My Modern Website

</header>

<div class="container">

<nav>

<a href="home.html" target="contentFrame">Home</a>


<a href="about.html" target="contentFrame">About</a>

<a href="contact.html" target="contentFrame">Contact</a>

</nav>

<iframe src="home.html" name="contentFrame"></iframe>

</div>

</body>

</html>

2 Home Page (home.html)

html

CopyEdit

<!DOCTYPE html>

<html>

<head>< tle>Home</ tle></head>

<body>

<h2>Home Page</h2>

<p>Welcome to the home page content.</p>

</body>

</html>

3 About Page (about.html)

html

CopyEdit

<!DOCTYPE html>

<html>

<head>< tle>About</ tle></head>

<body>

<h2>About Us</h2>

<p>We are a company dedicated to web development tutorials.</p>


</body>

</html>

4 Contact Page (contact.html)

html

CopyEdit

<!DOCTYPE html>

<html>

<head>< tle>Contact</ tle></head>

<body>

<h2>Contact Us</h2>

<p>Contact us at: [email protected]</p>

</body>

</html>
Q10 Design a web document by using html to implement forms and controls

<html>

<head>< tle>Form Example</ tle></head>

<body>

<form>

Name: <input type="text" name="name"><br>

Gender: <input type="radio" name="gender" value="Male"> Male

<input type="radio" name="gender" value="Female"> Female<br>

Course:

<select name="course">

<op on value="bba">BBA</op on>

<op on value="bca">BCA</op on>

</select><br>

<input type="submit" value="Submit">

</form>

</body>

</html>
Q11 Prepare a resume in html with objec ves, educa on, hobbies and extracurricular ac vi es

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, ini al-scale=1.0"/>

< tle>Resume -Aadi Jain</ tle>

<style>

body {

font-family: Arial, sans-serif;

margin: 0;

padding: 40px;

background-color: #f5f7fa;

color: #333;

.container {

max-width: 900px;

margin: auto;

background: white;

padding: 40px;

box-shadow: 0 0 10px rgba(0,0,0,0.1);

posi on: rela ve;

h1, h2 {

border-bo om: 2px solid #007BFF;

padding-bo om: 5px;

color: #007BFF;

ul {

list-style-type: square;
margin-le : 20px;

sec on {

margin-bo om: 30px;

.header {

display: flex;

jus fy-content: space-between;

align-items: center;

margin-bo om: 40px;

.header-text {

flex: 1;

.header h1 {

margin: 0;

font-size: 36px;

.header p {

font-size: 18px;

color: #666;

.profile-img {

width: 120px;

height: 120px;

border-radius: 50%;

object-fit: cover;

border: 3px solid #007BFF;

.print-bu on {

posi on: absolute;


top: 20px;

right: 20px;

background: #007BFF;

color: white;

border: none;

padding: 10px 20px;

cursor: pointer;

border-radius: 6px;

font-size: 14px;

.print-bu on:hover {

background-color: #0056b3;

@media print {

.print-bu on {

display: none;

</style>

</head>

<body>

<div class="container">

<bu on class="print-bu on" onclick="window.print()">Download PDF</bu on>

<div class="header">

<div class="header-text">

<h1>Aadi Jain</h1>

<p>Email: [email protected]<br>

Phone: +91-9773710365<br>

Loca on: Delhi,India </p>


</div>

<img class="profile-img" src="aadijain.jpg" alt="Profile Photo" />

</div>

<sec on>

<h2>Objec ve</h2>

<p>

To leverage my enthusiasm, dedica on, and communica on skills to grow personally and
professionally

while contribu ng meaningfully to a dynamic and progressive organiza on.

</p>

</sec on>

<sec on>

<h2>Educa on</h2>

<ul>

<li><strong>Dr. Akhilesh Das Gupta Ins tute of Professional Studies</strong> – BBA, Pursuing,
2024–2027</li>

<li><strong>Senior Secondary</strong> – CBSE Board, 2023 (Commerce Stream)</li>

<li><strong>Secondary</strong> – CBSE Board, 2020</li>

</ul>

</sec on>

<sec on>

<h2>Hobbies</h2>

<ul>

<li>playing Volleyball </li>

<li>Updated about Cars </li>

<li>Watching Vlogs </li>

</ul>

</sec on>
<sec on>

<h2>Extracurricular Ac vi es</h2>

<ul>

<li>Ac ve par cipant in debates and public speaking sessions</li>

<li>Ac ve par cipant college events </li>

<li>Regular contributor to web development program </li>

</ul>

</sec on>

</div>

</body>
</html>
Q12 Design a web document to implement the use of mul media components in web page

<html>

<head>< tle>Mul media</ tle></head>

<body>

<h2>Video Example</h2>

<video width="320" height="240" controls>

<source src="video.mp4" type="video/mp4">

Your browser does not support the video tag.

</video>

<h2>Audio Example</h2>

<audio controls>

<source src="audio.mp3" type="audio/mp3">

Your browser does not support the audio element.

</audio>

</body>

</html>

You might also like