Scribd
Upload
8 views41 pages

HTML Record

The document provides instructions for creating an HTML website for a college, including sections for country links that lead to individual country pages, courses offered, faculty details, and various forms such as a registration form and bio-data. It includes code snippets for HTML structures like lists, tables, frames, and a biodata form. Additionally, it outlines the layout and styling for the college's web pages.

Uploaded by

Dhilsanth SL
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
8 views41 pages

HTML Record

The document provides instructions for creating an HTML website for a college, including sections for country links that lead to individual country pages, courses offered, faculty details, and various forms such as a registration form and bio-data. It includes code snippets for HTML structures like lists, tables, frames, and a biodata form. Additionally, it outlines the layout and styling for the college's web pages.

Uploaded by

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

CONTENT

1
College WebSite
1
Write names of several countries in a paragraph and store it as an HTML
document, world.html. Each country name must be a hot text. When you 6
2
click India (for example), it must open india.html and it should provide a
brief introduction about India.

3 i) 11
Display Text with Bullets and Numbers

ii) Display Table Format 15

4 Frames and Framesets 19

5 28
Bio-Data

6 33
Registration Form for an inter-collegiate function.

7 39
Customer Details

8 PrimeNumbers 51
1. CODE
<html>
<head>
<title>
College Department Details
</title>
</head>
<body bgcolor="lightgray">
<h1 align="center" style="color: red;">SALEM SOWDESWARI COLLEGE (SFCW)</h1>
<h2 align="center" style="color: blue;">SALEM-10</h2>
<h3 align="center" style="color: black;">Afliated to Periyar University,Salem-11</h3>
<hr>
<h2 align="center" style="color: green;">About College </h2>
<p style="font-family:courier";>Salem Sowdeswari College (SSC) was founded in 1975 by Dr.
J.K.K. Angappa Chettiar and Amarar Thiru. T.N.K. Govindaraju Chettiar, under the management of
Sri Sowdeswari Mahajana Charitable Trust.

SSC was declared open on 14.07.1975 by the Founder Chairman Amarar Thiru. T.N.K. Govindaraju
Chettiar, an eminent Philanthropist-Industrialist from Madras and by the Vice Chairman, Secretary
and Managing Trustee, Thiru. J.K.K.Angappa Chettiar, another eminent Philanthropist-Industrialist
from Komarapalayam.
</p>
<h2><b>Courses Offered</b></h2>
<ul>
<li>Bsc Computer Science</li>
<li>Bsc Physics</li>
<li>Bsc Chemistry</li>
<li>Bsc Bio Tech</li>
<li>Bsc Mathematics</li>
<li>Bsc Fashion Textails</li>
1
</ul>
<h2>Department of Computer Science</h2>
<p style="font-family:courier">To educate the young
minds with the ability to manage real world problem with the latest technology,
to inculcate professional behaviors, strong ethical values, innovative research capability and
leadership ability.
Help the students to explore the depths of computer science, exalt in them and at the same time join
hands with the other
branches of science to turn something virtual into real and vice versa.</p>
<h2>Faculties of Computer Science</h2>
<ol>
<li>Mr.S.Kumar</li>
<li>Mrs.K.Rajeswari</li>
<li>Mr.A.Sampath Kumar</li>
<li>Mrs.M.Srividya</li>
</ol>
<h3>Condact as </h3>
<p>Phone Number: 0427 2270537</p>
<p>Email:[email protected]</p>
</body>
</html>

OUTPUT
2
2.CODE

<!DOCTYPE html>
3
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>World Countries</title>
</head>
<body>
<p>
Here are some countries: <a href="C:\Users\user9\Desktop\india.html">India</a>, <a
href="C:\Users\user9\Desktop\USA.html">USA</a>, <a href="C:\Users\user9\Desktop\
France.html">France</a>, <a href="C:\Users\user9\Desktop\Japan.html">Japan</a>.
</p>
</body>
</html>

"C:\Users\user9\Desktop\india.html">
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About India</title>
</head>
<body>
<h1>India</h1>
<p>India is a vast South Asian country with diverse cultures, languages, and traditions. It is
known for its rich history, vibrant festivals, and iconic landmarks like the Taj Mahal.</p>
</body>
</html>

"C:\Users\user9\Desktop\USA.html">
4
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About USA</title>
</head>
<body>
<h1>USA</h1>
<p>The United States of America (USA), commonly known as the United States (U.S.) or
America, is a country primarily located in North America. It is a federal union of 50 states and a
federal capital district, Washington, D.C. The 48 contiguous states border Canada to the north and
Mexico to the south, with the states of Alaska to the northwest and the archipelagic Hawaii in the
Pacific Ocean.</p>
</body>
</html>

OUTPUT

5
3.i)CODE

6
<html>
<head>
<title>HTML Nested Unordered List</title>
</head>
<body>
<Ol>
<li>Fruits</li>
<ol type="A">
<li><td>Apple</li>
<li>Banana</li>
<li>Mango</li>
<li>Orange</li>
</Ol>
<li>Vegetables</li>
<ol type="A">
<li>Spinach</li>
<li>Cauliflower</li>
<li>Beetroot</li>
</ol>
<li>Cereals</li>
<li>Nuts</li>
</ul>
</body>
</html>

OUTPUT
7
3.ii)CODE
table border=1>
<tr>
8
<th>First Name</th>
<th>Last Name</th>
<th>Email Address</th>
</tr>
<tr>
<td>Hillary</td>
<td>Nyakundi</td>
<td>[email protected]</td>
</tr>
<tr>
<td>Lary</td>
<td>Mak</td>
<td>[email protected]</td>
</tr>
</table

OUTPUT

9
Ex. No: 4.
CODE
<html>
10
<head>
<title>HTML Target Frames</title>
</head>
<frameset cols="300, *">
<frame src="test2.php" name="menu_page" />
<frame src="demo.php" name="main_page" />
<noframes>
<body>
Your browser does not support frames.
</body>
</noframes>
</frameset>
</html>

FRAMES
<html>
<head>
</head>
<body>
<h3>Contact us</h3>
<ul>
<LI>Doctor Appointments / Emergency</LI>
<LI> NAME: Dr.PON PRABHU</LI>
<LI> ADDRESS: MOGANUR,NAMAKKAL </LI>
<LI> PHONE NO. : 9566015479</LI>
<LI> EMAIL ID: [email protected]</LI>
<LI> Patient Admission & Liaison Services</LI>
<LI> +91-80560 02444</LI>
</ul>
</body>
</html>
11
FRAMESET
<html>
<body>
<h1 style="color:VIOLET;"><B><CENTER><COLOR="JHCSVH">PEPOLE CARE
INTERNATIONAL HOSPITAL</B></H1>
<h2 class="section-heading">All Disease</h2>
</a>
<section>
<a href="#">
<h3>COVID-19</h3>
</a>
<a href="#">

<img src="C:\Users\Siddhant\Desktop\MY PROJECT\img\6.png" alt="Card Image">


</a>

<p>
People may be sick with the virus for 1 to 14 days before developing symptoms. The most
common symptoms of coronavirus disease (COVID-19) are fever, tiredness, and dry cough.
Most people (about 80%) recover from the disease without needing special treatment.

More rarely, the disease can be serious and even fatal. Older people, and people with other
medical conditions (such as asthma, diabetes, or heart disease), may be more vulnerable to
becoming severely ill.

People may experience:


cough
fever
tiredness
12
difficulty breathing (severe cases)
</p>
<a href="" class="btn-readmore">Read More</a>

</section>

<section>
<a href="#">
<h3>TUBERCULOSIS</h3>
</a>

<a href="#">
<img src="C:\Users\Siddhant\Desktop\MY PROJECT\img\4.png" alt="Card Image">
</a>
<p>
A potentially serious infectious bacterial disease that mainly affects the lungs.
The bacteria that cause TB are spread when an infected person coughs or sneezes.
Most people infected with the bacteria that cause tuberculosis don't have symptoms. When
symptoms do occur, they usually include a cough (sometimes blood-tinged), weight loss,
night sweats and fever.
Treatment isn't always required for those without symptoms. Patients with active symptoms
will require a long course of treatment involving multiple antibiotics.
</p>
<a href="#" class="btn-readmore">Read More</a>
</div>
</section>

<section>
<a href="#">
<h3>CANCER</h3>
</a>
13
<a href="#">
<img src="C:\Users\Siddhant\Desktop\MY PROJECT\img\5.png" alt="Card Image">
</a>
</div>

<p>
Cancer is a group of diseases involving abnormal cell growth with the potential to invade or
spread to other parts of the body. These contrast with benign tumors, which do not spread
</p>
<a href="#" class="btn-readmore">Read More</a>

</section>

<h2 class="section-heading">All Department</h2>


<section>
<a href="#">
<h3>Surgery </h3>
</a>

<a href="#">
<img src="C:\Users\Siddhant\Desktop\MY PROJECT\img\7.jpg" alt="Card Image">
</a>

<p>
Surgery is a medical specialty that uses operative manual and instrumental techniques on a
person to investigate or treat a pathological condition such as a disease or injury, to help
improve bodily function or appearance or to repair unwanted ruptured areas.
</p>
<a href="#" class="btn-readmore">Read More</a>
14
</section>
<section>
<a href="#">
<h3>Diagonistic </h3>
</a>

<a href="#">
<img src="C:\Users\Siddhant\Desktop\MY PROJECT\img\8.png" alt="Card Image">
</a>

<p>
Medical diagnosis is the process of determining which disease or condition explains a
person's symptoms and signs. It is most often referred to as diagnosis with the medical
context being implicit.
</p>
<a href="#" class="btn-readmore">Read More</a>

</section>

<section>
<a href="#">
<h3>Radiology</h3>
</a>

<a href="#">
<img src="C:\Users\Siddhant\Desktop\MY PROJECT\img\9.jpg" alt="Card Image">
</a>
<p>
Radiology is the medical discipline that uses medical imaging to diagnose and treat diseases
within the bodies of both humans and animals
15
</p>
<a href="#" class="btn-readmore">Read More</a>
</section>

<h2 class="section-heading">Patient Details and Admissions </h2>


<section id=section-source>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
</p>
<a href="#" class="btn-readmore">More Patients</a>
</section>
</body>
</html>

OUTPUT

16
Ex.NO: 5.
CODE
17
<html>
<head>
<title>BIODATA</title>
</head>
<marquee>
<body bgcolor="pink"><font color="black"><font size=30>Biodata</font>
</marquee>
<hr>
<body><font size=5><font color="blue">
<img src="Desert.jpg" align="right" height=50 width=50 1px>
Name:S.Nandhini<br>
Father's name:S.Selvarajan<br>
Mothers's name:S.Usha<br>
DOB:18:12:1997<br>
Address:Salem-10<br>
Mobile no:9659908730<br>
Religion:Hindu<br>
Nationality:Indian<br>
Gender:Female<br>
Qualification:BCA<br>
<table style="width:50%"border=3>
<tr>
<th>semester</th>
<th>grade</th>
<th>cpga %</th>
</tr>
<tr>
<th>1</th>
<th>S</th>
<th>80%</th>
</tr>
18
<tr>
<th>2</th>
<th>A</th>
<th>78 %</th>
</tr>
</body>
</html>

OUTPUT
19
Ex.No: 6.
CODE
<Html>

20
<head>
<title>
Registration Form for an inter-collegiate function
</title>
</head>
<body bgcolor="red">
<br>
<br>
<h1> Registration Form for an inter-collegiate function</h1>
<form>

<label> College Name </label>


<input type="text" name="College Name" size="20"/> <br> <br>
<label> Student name </label>
<input type="text" name="Studentname" size="15"/> <br> <br>
<label> Roll no: </label>
<input type="text" name="Roll no" size="15"/> <br> <br>
<label> Department: </label>
<input type="text" name="Department" size="15"/> <br> <br>

<label>
Event :
</label>
<select>
<option value="Event">Event</option>
<option value="Dance">Dance</option>
<option value="Singing">Singing</option>
<option value="Quize">Quize</option>
21
<option value="Painting">ainting</option>
<option value="mime">mime</option>
<option value="Rangoli">Rangoli</option>
</select>

<br>
<br>
<label>
Gender :
</label><br>
<input type="radio" name="male"/> Male <br>
<input type="radio" name="female"/> Female <br>
<input type="radio" name="other"/> Other
<br>
<br>

<label>
Phone :
</label>
<input type="text" name="country code" value="+91" size="2"/>
<input type="text" name="phone" size="10"/> <br> <br>
Address
<br>
<textarea cols="40" rows="2" value="address">
</textarea>
<br> <br>
<input type="button" value="Submit"/>
</form>
22
</body>
</html>

OUTPUT

23
Ex.No: 7.
Index.html
<!DOCTYPE html>
<html lang="en">
24
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CUSTOMER DETAILS</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}

.main {
background-color: #fff;
border-radius: 15px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
padding: 20px;
width: 300px;
}

.main h2 {
color: #4caf50;
margin-bottom: 20px;
}

label {
display: block;
25
margin-bottom: 5px;
color: #555;
font-weight: bold;
}

input[type="text"],
input[type="email"],
input[type="password"],
select {
width: 100%;
margin-bottom: 15px;
padding: 10px;
box-sizing: border-box;
border: 1px solid #ddd;
border-radius: 5px;
}

button[type="submit"] {
padding: 15px;
border-radius: 10px;
border: none;
background-color: #4caf50;
color: white;
cursor: pointer;
width: 100%;
font-size: 16px;
}
</style>
</head>

<body>
26
<div class="main">
<h2>Customer details</h2>
<form action="test.php" method="post">

<button type="submit" value="New Customer">


New Customer
</button>
</form>
<br>
<form action="ser.php" method="post">
<button type="submit" value="search">
Search
</button>
</div>
</body>
</html>

Test.php
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>HTML Registration Form</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
27
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}

.main {
background-color: #fff;
border-radius: 15px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
padding: 20px;
width: 300px;
}

.main h2 {
color: #4caf50;
margin-bottom: 20px;
}

label {
display: block;
margin-bottom: 5px;
color: #555;
font-weight: bold;
}

input[type="text"],
input[type="email"],
input[type="password"],
select {
28
width: 100%;
margin-bottom: 15px;
padding: 10px;
box-sizing: border-box;
border: 1px solid #ddd;
border-radius: 5px;
}

button[type="submit"] {
padding: 15px;
border-radius: 10px;
border: none;
background-color: #4caf50;
color: white;
cursor: pointer;
width: 100%;
font-size: 16px;
}
</style>
</head>

<body>
<div class="main">
<h2>Registration Form</h2>
<form action="reg.php" method="post">
<label for="cn"> Customer ID:</label>
<input type="text" id="cid" name="cid" required />

<label for="cn"> Customer Name:</label>


<input type="text" id="cn" name="cn" required />

29
<label for="ct"> City:</label>
<input type="text" id="ct" name="ct" required />

<label for="pc"> Pin code:</label>


<input type="text" id="pc" name="pc" maxlength="6" required />

<label for="ph"> Phone number:</label>


<input type="text" id="ph" name="ph" maxlength="10" required />

<label for="email">Email:</label>
<input type="email" id="email" name="email" required />
<label for="gender">Gender:</label>
<select id="gender" name="gender" required>
<option value="male">
Male
</option>
<option value="female">
Female
</option>
<option value="other">
Other
</option>
</select>

<button type="submit" value="Registration">


Submit
</button>
</form>
</div>
</body>

30
</html>
Reg.php

<?php
$cid=$_POST['cid'];
$cn=$_POST['cn'];
$ct=$_POST['ct'];
$pc=$_POST['pc'];
$ph=$_POST['ph'];
$email=$_POST['email'];
$gender=$_POST['gender'];
$con=mysql_connect("localhost","root","")or die(mysql_error());
$seldb=mysql_select_db("customer",$con);
$query="insert into reg values('$cid','$cn','$ct','$pc','$ph','$email','$gender')";
$result=mysql_query($query);
?>
Ser.php

<!DOCTYPE html>
<html lang="en">
<body>

<h2>Enter Customer Details</h2>


<form action="ck1.php" method="post">
<label for="cn"> Customer ID:</label>
<input type="text" id="cid" name="cid" required />
<br>

<br>
<br>
<label for="pc"> Pin code:</label>
31
<input type="text" id="pc" name="pc" maxlength="6" required />
<br>
<br>
<br>
<button type="submit" >
Open
</button>
</form>
</body>
</html>

Ck1.php

<?php
if(($cid=$_POST['cid'])&&($pc=$_POST['pc']))
{
$cid=$_POST['cid'];
$cn=$_POST['cn'];
$ct=$_POST['ct'];
$pc=$_POST['pc'];
$ph=$_POST['ph'];
$email=$_POST['email'];
$gender=$_POST['gender'];
$con=mysql_connect("localhost","root","")or die(mysql_error());
$seldb=mysql_select_db("customer",$con);
$q = mysql_query("SELECT * FROM reg WHERE cid ='".$cid."' AND pc ='".$pc."'") or
die(mysql_error());
echo "Customer name: ";
echo $cid;
echo "<br>";
echo $cn;
32
echo "<br>";
echo $ct;
echo "<br>";
echo $pc;
echo "<br>";
echo $ph;
echo "<br>";
echo $email;
echo "<br>";
echo $gender;
}
else
{
echo "Please Check.........";
}
?>

OUTPUT

33
34
35
Ex No :8
CODE

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Prime Number Finder</title>
</head>
<body>
<h2>Find Prime Numbers Between Two Numbers</h2>
<form method="POST" action="">
<label for="n1">Enter First Number (n1): </label>
<input type="number" id="n1" name="n1" required><br><br>

<label for="n2">Enter Second Number (n2): </label>


<input type="number" id="n2" name="n2" required><br><br>

<input type="submit" value="Find Prime Numbers">


</form>

<?php

if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['n1']) &&


isset($_POST['n2'])) {
// Get the values of n1 and n2 from the form

36
$n1 = $_POST['n1'];
$n2 = $_POST['n2'];

if (is_numeric($n1) && is_numeric($n2)) {


function isPrime($num) {
if ($num <= 1) {
return false;
}
for ($i = 2; $i <= sqrt($num); $i++) {
if ($num % $i == 0) {
return false;
}
}
return true;
}
$start = min($n1, $n2);
$end = max($n1, $n2);

echo "<h3>Prime Numbers between $start and $end are:</h3>";


$primeNumbers = array();
for ($i = $start; $i <= $end; $i++)
{
if (isPrime($i)) {
$primeNumbers[] = $i;
}
}
if (count($primeNumbers) > 0) {
echo implode(", ", $primeNumbers);
37
} else {
echo "No prime numbers found in this range.";
}
} else {
echo "Please enter valid numeric values for both n1 and n2.";
}
}
?>
</body>
</html>

38
OUTPUT

39

You might also like