Scribd
Upload
89 views37 pages

Final Project

The document describes creating several HTML files and web pages with different HTML tags and attributes. It includes examples of creating pages with headings, text formatting, images, links, and lists.

Uploaded by

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

Final Project

The document describes creating several HTML files and web pages with different HTML tags and attributes. It includes examples of creating pages with headings, text formatting, images, links, and lists.

Uploaded by

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

GURU GOBIND SINGH INDRAPRASTHA UNIVERSITY

New Delhi

MAHARAJA SURAJMAL INSTITUTE


C-4, Janakpuri, New

Delhi E-commerce Lab

Subject Code-BBA- 108

SUBMITTED BY

STUDENT NAME-Vipul Sharma SUBMITTE

ENROLLMENT NO.-00121201823 D TO- DR. ITTI

BBA (B&I) HOODA


PRACTICAL-1
CREATE A HTML FILE FOR DISPLAYING A WEB PAGE WITH
FOLLOWING TAGS.THE FILE SHOULD CONTAIN A BRIEF
DESCRIPTION ABOUT ALL THESE TAGS Tags- br, b, I, u, pre, p,
div, strike, marquee, font tag.
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Tags Overview</title>
</head>
<body>
<h1>HTML Tags Overview</h1>

<h2>&lt;br&gt; - Line Break</h2>


<p>The &lt;br&gt; tag is used to insert a line break in the text. It doesn't require a closing
tag.</p>

<h2>&lt;b&gt; - Bold</h2>
<p>The &lt;b&gt; tag is used to make text bold.</p>

<h2>&lt;i&gt; - Italic</h2>
<p>The &lt;i&gt; tag is used to make text italicized.</p>

<h2>&lt;u&gt; - Underline</h2>
<p>The &lt;u&gt; tag is used to underline text.</p>

<h2>&lt;pre&gt; - Preformatted Text</h2>


<p>The &lt;pre&gt; tag is used to preserve whitespace and line breaks in text, displaying it
exactly as written in the HTML code.</p>

<h2>&lt;p&gt; - Paragraph</h2>
<p>The &lt;p&gt; tag is used to define a paragraph of text.</p>

<h2>&lt;div&gt; - Division</h2>
<p>The &lt;div&gt; tag is used to define a division or section in an HTML document. It's often
used for styling purposes or to group elements together.</p>

<h2>&lt;strike&gt; - Strikethrough</h2>
<p>The &lt;strike&gt; tag is used to draw a horizontal line through text, indicating that it's no
longer accurate or relevant.</p>

<h2>&lt;marquee&gt; - Marquee</h2>
<p>The &lt;marquee&gt; tag is used to create a scrolling or moving text or image.</p>

<h2>&lt;font&gt; - Font</h2>
<p>The &lt;font&gt; tag is used to specify the font, size, color, and other text properties.</p>
</body>
</html>
OUTPUT:
PRACTICAL-2
WRITE A QUADRATIC EQUATION 𝑎𝑥 2 + 𝑏𝑥 + 𝑐 and H2O formula using Sub, Sup html tag.
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Quadratic Equation and H₂O Formula</title>
</head>
<body>
<h1>Quadratic Equation and H₂O Formula</h1>

<h2>Quadratic Equation</h2>
<p>A quadratic equation is typically written in the form:</p>
<p>𝑎𝑥<sup>2</sup> + 𝑏𝑥 + 𝑐</p>
<p>Where:</p>
<ul>
<li>𝑎, 𝑏, and 𝑐 are coefficients,</li>
<li>𝑥 is the variable, and</li>
<li><sup>2</sup> represents the exponent indicating the squared
term.</li>
</ul>

<h2>H<sub>2</sub>O Formula</h2>
<p>The chemical formula for water (H<sub>2</sub>O) consists of:</p>
<ul>
<li>Two atoms of Hydrogen (H), and</li>
<li>One atom of Oxygen (O).</li>
</ul>
<p>Thus, the formula for water is written as H<sub>2</sub>O.</p>
</body>
</html>
OUTPUT:
PRACTICAL-3
DESIGN A WEB PAGE OF YOUR CV WITH HEADINGS AS
OBJECTIVES, EDUCATIONAL QUALIFICATIONS,
ACHIEVEMENTS, STRENGHTS, HOBBIES AND PERSONAL
DETAILS.
INPUT:
<! html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My CV</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
h1, h2 {
color: #333;
}
section {
padding: 20px;
background-color: #fff;
margin: 20px;
border-radius: 5px;
}
ul {
list-style-type: disc;
margin-left: 20px;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px;
position: fixed;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>

<header>
<h1>Vipul Sharma</h1>
<p>Curriculum vitae</p>
</header>

<section>
<h2>Educational Qualifications</h2>
<ul>
<li>Bachelor of Business Admiration(B&I) -ipu University (2026)</li>
<li>High School Diploma - Suraj bhan D.A.V public school (2023)</li>
</ul>
</section>

<section>
<h2>Strengths</h2>
<ul>
<li>Strong problem-solving skills.</li>
<li>Excellent communication and teamwork abilities.</li>
</ul>
</section>

<section>
<h2>Hobbies</h2>
<p>Reading, hiking, playing guitar.</p>
</section>

<section>
<h2>Personal Details</h2>
<ul>
<li>Date of Birth: January 21, 2005</li>
<li>Address: 29/d b-2 royal complex,royal enclave-1 desu road
mehrauli</li>
<li>Email: [email protected]</li>
<li>Phone: +917011276986</li>
</ul>
</section>

<footer>
<p>&copy; 2024 vipul sharma | All rights reserved</p>
</footer>

</body>
</html>
OUTPUT:
PRACTICAL-4
CREATE A WEB PAGE THAT USES VARIOUS ATTRIBUTES OF
FONT TAG

INPUT:

<! html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Font Tag Attributes</title>
</head>
<body>

<!-- Using the font tag with various attributes -->

<!-- Changing font size -->


<font size="6">This text is in size 6 font.</font><br>

<!-- Changing font color -->


<font color="red">This text is in red color.</font><br>

<!-- Changing font face -->


<font face="Arial">This text is in Arial font.</font><br>

<!-- Combining attributes -->


<font size="4" color="blue" face="Verdana">This text is size 4, blue color, and
in Verdana font.</font><br>

<!-- Using the deprecated align attribute -->


<font size="4" color="green" face="Courier" align="center">This text is size 4,
green color, in Courier font, and centered.</font><br>

</body>
</html>

OUTPUT:
PRACTICAL-5
DESIGN A WEB SITE WITH THE NAME AS HTML TUTORIAL
WITH FOLLOWING SPECIFICATIONS: Make following hyperlinks (i.e., 5 different web pages):
1. Formatting Styles and Headings: Include Bold, italics, Underline, Strike, Subscript,
superscript and all six types of headings
2. Font Styles and Images: Font and Base font tag, Image tag
3. Anchor: Internal (linking within page) and External (linking with other documents)
links
4. Marquee: Move text, image and hyperlink
5. Other tags: br, hr, pre, p
INPUT:
<! html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Tutorial</title>
</head>
<body>

<!-- Page 1: Formatting Styles and Headings -->


<h1>Formatting Styles and Headings</h1>
<p>This page demonstrates various formatting styles and headings.</p>
<p><strong>Bold Text</strong></p>
<p><em>Italic Text</em></p>
<p><u>Underlined Text</u></p>
<p><strike>Strikethrough Text</strike></p>
<p><sub>Subscript Text</sub></p>
<p><sup>Superscript Text</sup></p>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
<hr>

<!-- Page 2: Font Styles and Images -->


<h1>Font Styles and Images</h1>
<p>This page demonstrates font styles and image insertion.</p>
<font size="4">This text is in size 4 font.</font><br>
<font face="Arial">This text is in Arial font.</font><br>
<img src="image.jpg" alt="Example Image">

<!-- Page 3: Anchor -->


<h1>Anchor</h1>
<p>This page demonstrates internal and external links.</p>
<a href="#page1">Go to Page 1</a><br>
<a href="https://www.example.com">External Link</a>

<!-- Page 4: Marquee -->


<h1>Marquee</h1>
<p>This page demonstrates moving text, images, and hyperlinks.</p>
<marquee behavior="scroll" direction="left">This text moves from right to
left.</marquee><br>
<marquee behavior="alternate"><img src="image.gif" alt="Moving
Image"></marquee><br>
<marquee behavior="scroll" direction="up"><a href="#page2">Go to Page
2</a></marquee>

<!-- Page 5: Other Tags -->


<h1>Other Tags</h1>
<p>This page demonstrates the br, hr, pre, and p tags.</p>
<p>This is a paragraph.</p>
<hr>
<p>This is another paragraph.</p>
<pre>
This text is displayed in a preformatted style.
It preserves both spaces and line breaks.
</pre>
<br>
<a href="#page3">Go to Page 3</a>

</body>
</html>
OUTPUT:
PRACTICAL-6
CREATE A PROGRAM USING ORDERED AND UNORDERED
LISTS With the hyperlinks- Fruits, Vegetables, Newspaper and Magazines and create ordered and
unordered lists with price and image
of each list item.
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Shopping List</title>
</head>
<body>

<h1>Shopping List</h1>

<!-- Fruits -->


<h2>Fruits</h2>
<ul>
<li>
<strong>Apple</strong>
<ul>
<li>Price: 50rupees</li>
<li><img src="apple.jpg" alt="Apple"></li>
</ul>
</li>
<li>
<strong>Banana</strong>
<ul>
<li>Price:40rupees</li>
<li><img src="banana.jpg" alt="Banana"></li>
</ul>
</li>
<li>
<strong>Orange</strong>
<ul>
<li>Price:80 rupees</li>
<li><img src="orange.jpg" alt="Orange"></li>
</ul>
</li>
</ul>

<!-- Vegetables -->


<h2>Vegetables</h2>
<ol>
<li>
<strong>Carrot</strong>
<ul>
<li>Price:60 rupees</li>
<li><img src="carrot.jpg" alt="Carrot"></li>
</ul>
</li>
<li>
<strong>Broccoli</strong>
<ul>
<li>Price: 30 rupees</li>
<li><img src="broccoli.jpg" alt="Broccoli"></li>
</ul>
</li>
<li>
<strong>Tomato</strong>
<ul>
<li>Price:80rupees</li>
<li><img src="tomato.jpg" alt="Tomato"></li>
</ul>
</li>
</ol>

<!-- Newspaper and Magazines -->


<h2>Newspapers and Magazines</h2>
<ul>
<li>
<strong>New York Times</strong>
<ul>
<li>Price:30 rupees</li>
<li><img src="nytimes.jpg" alt="New York Times"></li>
</ul>
</li>
<li>
<strong>National Geographic</strong>
<ul>
<li>Price:40 rupees</li>
<li><img src="natgeo.jpg" alt="National Geographic"></li>
</ul>
</li>
<li>
<strong>Time Magazine</strong>
<ul>
<li>Price:30 rupees</li>
<li><img src="time.jpg" alt="Time Magazine"></li>
</ul>
</li>
</ul>

</body>
</html>
PRACTICAL-7
CREATE A TABLE – Seminar Schedule
INPUT:
<html>
<head> <title> <b> Seminar Schedule </b> </title> </head>
<body> <table border="1">
<caption> Seminar Schedule </caption>
<tr> <th rowspan ="3" bgcolor ="silver"> Day </th>
<th colspan = "3", bgcolor ="RED"> Seminar </th> </tr>
<tr> <th colspan = "2", bgcolor ="silver" > Schedule </th>
<th rowspan ="2", bgcolor ="silver" > Topic </th>
</tr>
<tr> <td align="center"> Begin </td>
<td align ="center"> End </td> </tr>
<tr> <th rowspan ="2", bgcolor="RED"> Monday </th>
<td> 8:00 am </td>
<td> 11:00 am </td>
<th> OS </th> </tr>
<tr> <td> 11:30 am </td>
<td> 1:00 pm </td>
<th> Digital Marketing </th> </tr>
<tr> <th rowspan ="2" bgcolor="RED"> Tuesday </th>
<td> 8:00 am </td>
<td> 11:00 am </td>
<th> python </td> </tr>
<tr> <td> 11:30 am </td>
<td> 1:00 pm </td>
<th> cyber security </th> </tr>
<tr> <th colspan ="4"> Lunch Break </th></tr>
<tr> <th bgcolor="RED"> Tuesday </th>
<td> 2:00 pm </td>
<td> 4:00 pm </td>
<th> Data communications </th> </tr>
<tr> <th rowspan="2" bgcolor="RED"> Wednesday </th>
<td> 9:00 am </td>
<td> 11:00 am </td>
<th> AI/ML </th> </tr>
<tr> <th colspan = "3"> 11:00- onwards Valedictory Session </th> </tr>
</table>
</html>
OUTPUT:
PRACTICAL-8
CREATE CLASS TIME TABLE
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Class Timetable</title>
<style>
table {
width: 100%;
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: center;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>

<h2>Class Timetable</h2>

<table>
<tr>
<th>Time</th>
<th>Monday</th>
<th>Tuesday</th>
<th>Wednesday</th>
<th>Thursday</th>
<th>Friday</th>
</tr>
<tr>
<td>12:00 - 1:00</td>
<td>Bm</td>
<td>Bm</td>
<td>Bm</td>
<td>Bm</td>
<td>Be</td>
</tr>
<tr>
<td>1:00 - 2:00</td>
<td>CA</td>
<td>Be</td>
<td>Ec</td>
<td>BE</td>
<td>POI</td>
</tr>
<tr>
<td>2:00 - 2:30</td>
<td>LUNCH</td>
<td>LUCH</td>
<td>LUNCH</td>
<td>LUNCH</td>
<td>LUCH</td>
</tr>
<tr>
<td>2:30 - 3:30</td>
<td>POI</td>
<td>EC</td>
<td>BE</td>
<td>POI</td>
<td>CA</td>
</tr>
<tr>
<td>3:30 - 4:30</td>
<td></td>
<td>CA</td>
<td>CA</td>
<td>ECOM(LAB)</td>
<td>EC</td>
</tr>
</table>

</body>
</html>
OUTPUT:
PRACTICAL-9
WRITE AN HTML CODE TO DISPLAY SYLLABUS OF BBA. CLICKING ON EACH LINK
SHOULD OPEN THE DESCRIPTION
OF THE SUBJECT.
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BBA Syllabus</title>
</head>
<body>

<h2>BBA Syllabus</h2>

<!-- Subject Links -->


<ul>
<li><a href="#subject1">Business mathamatics</a></li>
<li><a href="#subject2">Cost accounting</a></li>
<li><a href="#subject3">Business Enviourment</a></li>
<li><a href="#subject4">Principles of insurance</a></li>
<li><a href="#subject5">E-commerce</a></li>
</ul>

<!-- Subject Descriptions -->


<div id="subject1">
<h3>Business mathamatics</h3>
<p>This course covers the principles and practices of marketing
management, including market analysis, consumer behavior, product
development, pricing strategies, distribution channels, and promotion.</p>
</div>

<div id="subject2">
<h3>Cost Accounting</h3>
<p>This course introduces students to the fundamentals of cost accounting,
including recording transactions, preparing financial statements, analyzing
financial data, and interpreting financial results.</p>
</div>

<div id="subject3">
<h3>Business Enviourment</h3>
<p>This course focuses on developing Economics skills in a business
context, including written communication, oral communication, presentation
skills, and interpersonal communication.</p>
</div>

<div id="subject4">
<h3>Principles of insurance</h3>
<p>This course examines the role of principle of insurance .</p>
</div>

<div id="subject5">
<h3>E-commerce</h3>
<p>This course covers the knowledge of e-commerce platform.</p>
</div>

</body>
</html>
OUTPUT:
PRACTICAL-10
CREATE AN HTML DOCUMENT USING BASE TAG, ALL ATTRIBUTES OF TARGET TAG
AND INSERT AN IMAGE LINK
IN THE SAME.
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Document with Base Tag</title>
<base href="https://example.com/" target="_blank" />
</head>
<body>

<h1>HTML Document with Base Tag</h1>

<!-- Image Link -->


<a href="hello-world-vector-16780393.Jpg" target="_self">
<img src="C:\Users\bhavy\Downloads\hello-world-vector-16780393"
alt="Example Image" width="300" height="200" border="1" />

</a>

</body>
</html>
OUTPUT:
PRACTICAL-11
Create a HTML webpage using Nested Tables which display the
following list.
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nested Tables Example</title>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
padding: 8px;
}
</style>
</head>
<body>

<h2>Nested Tables Example</h2>

<table>
<tr>
<th>Main Category</th>
<th>Sub Category</th>
<th>Description</th>
</tr>
<tr>
<td rowspan="3">Category 1</td>
<td>Subcategory 1.1</td>
<td>Description for Subcategory 1.1</td>
</tr>
<tr>
<td>Subcategory 1.2</td>
<td>Description for Subcategory 1.2</td>
</tr>
<tr>
<td>Subcategory 1.3</td>
<td>Description for Subcategory 1.3</td>
</tr>
<tr>
<td rowspan="2">Category 2</td>
<td>Subcategory 2.1</td>
<td>Description for Subcategory 2.1</td>
</tr>
<tr>
<td>Subcategory 2.2</td>
<td>Description for Subcategory 2.2</td>
</tr>
</table>

</body>
</html>
OUTPUT:
PRACTICAL-12
CREATE TARGET ATTRIBUTE (Self, Blank, Top & Parent) Using Hyperlink
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Target Attribute Example</title>
</head>
<body>

<h2>Target Attribute Example</h2>

<!-- Self (Opens in the same window) -->


<a href="https://www.example.com" target="_self">Open in Same Window
(Self)</a><br>

<!-- Blank (Opens in a new blank window or tab) -->


<a href="https://www.example.com" target="_blank">Open in New Window or
Tab (Blank)</a><br>

<!-- Top (Opens in the linked document in the full body of the window) -->
<a href="https://www.example.com" target="_top">Open in Full Window
(Top)</a><br>

<!-- Parent (Opens in the linked document in the parent frame) -->
<a href="https://www.example.com" target="_parent">Open in Parent Frame
(Parent)</a><br>

</body>
</html>
OUTPUT:
PRACTICAL-13
Create a descriptive list of Mobile Store named- HP World
1. Create descriptive list of mobile phones with price and specifications including image
2. Create descriptive list of pen drive, hard disk with price and image

INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HP World - Mobile Store</title>
</head>
<body>

<h1>HP World - Mobile Store</h1>

<!-- Descriptive List of Mobile Phones -->


<h2>Mobile Phones</h2>
<dl>
<dt>iPhone 12</dt>
<dd>
<img src="iphone12.jpg" alt="iPhone 12" width="200"><br>
Price: 150000<br>
Specifications: 6.1-inch Super Retina XDR display, A14 Bionic chip,
Dual-camera system, 5G capable.
</dd>
<dt>Samsung Galaxy S21</dt>
<dd>
<img src="galaxys21.jpg" alt="Samsung Galaxy S21" width="200"><br>
Price: 100000<br>
Specifications: 6.2-inch Dynamic AMOLED 2X display, Exynos
2100/Snapdragon 888 chip, Triple-camera system, 5G capable.
</dd>
</dl>

<!-- Descriptive List of Pen Drives and Hard Disks -->


<h2>Pen Drives and Hard Disks</h2>
<dl>
<dt>Sandisk 128GB USB 3.0 Pen Drive</dt>
<dd>
<img src="pen_drive.jpg" alt="Sandisk Pen Drive" width="200"><br>
Price: 500<br>
USB 3.0 compatible, 128GB storage capacity.
</dd>
<dt>Seagate 1TB Portable External Hard Drive</dt>
<dd>
<img src="external_hdd.jpg" alt="Seagate External Hard Drive"
width="200"><br>
Price: 6000<br>
USB 3.0 interface, 1TB storage capacity, compact design.
</dd>
</dl>

</body>
</html>
OUTPUT:
PRACTICAL-14
Create a document using I frame tag in HTML.
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>IFrame Example</title>
</head>
<body>

<h1>IFrame Example</h1>

<p>Here is an embedded webpage:</p>

<iframe src="https://www.example.com" width="800" height="600"


frameborder="0"></iframe>

<p>This is an embedded webpage from example.com using the iframe tag.</p>

</body>
</html>
OUTPUT:
PRACTICAL-15
Create a frame showing three sections
Section 1- Any Website link
Section 2- Any Image link
Section 3- Any Video using link
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Frame Example</title>
</head>
<body>

<h1>Frame Example</h1>

<!-- Section 1: Website Link -->


<iframe src="https://www.example.com" width="400" height="300"
frameborder="0"></iframe>

<!-- Section 2: Image Link -->


<iframe src="https://www.example.com/image.jpg" width="400" height="300"
frameborder="0"></iframe>

<!-- Section 3: Video Link -->


<iframe src="https://www.example.com/video.mp4" width="400" height="300"
frameborder="0"></iframe>

</body>
</html>
OUTPUT:
PRACTICAL-16
Create a student registration form in HTML
INPUT:
<!html>

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Student Registration Form</title>
</head>
<body>

<h2>Student Registration Form</h2>

<form action="#" method="post">


<label for="fullname">Full Name:</label><br>
<input type="text" id="fullname" name="fullname" required><br><br>

<label for="email">Email:</label><br>
<input type="email" id="email" name="email" required><br><br>

<label for="phone">Phone:</label><br>
<input type="tel" id="phone" name="phone" pattern="[0-9]{10}"
required><br><br>

<label for="dob">Date of Birth:</label><br>


<input type="date" id="dob" name="dob" required><br><br>

<label for="gender">Gender:</label><br>
<input type="radio" id="male" name="gender" value="male" required>
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="female" required>
<label for="female">Female</label>
<input type="radio" id="other" name="gender" value="other" required>
<label for="other">Other</label><br><br>

<label for="address">Address:</label><br>
<textarea id="address" name="address" rows="4" cols="50"
required></textarea><br><br>

<label for="course">Select Course:</label><br>


<select id="course" name="course" required>
<option value="">Select...</option>
<option value="Computer Science">Computer Science</option>
<option value="Engineering">Engineering</option>
<option value="Mathematics">Mathematics</option>
<option value="Biology">Biology</option>
<option value="Business">Business</option>
</select><br><br>

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


</form>

</body>
</html>
OUTPUT:

You might also like