0% found this document useful (0 votes)
12 views2 pages

Web

The document is an HTML template for a university website featuring a navigation bar, sections for 'About', 'Courses', and 'Contact', and a footer. It includes JavaScript to toggle visibility of content sections and utilizes Bootstrap for styling. Additionally, there is a separate student registration form with fields for student details and a table displaying student information.

Uploaded by

kadiyamkarthik09
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
0% found this document useful (0 votes)
12 views2 pages

Web

The document is an HTML template for a university website featuring a navigation bar, sections for 'About', 'Courses', and 'Contact', and a footer. It includes JavaScript to toggle visibility of content sections and utilizes Bootstrap for styling. Additionally, there is a separate student registration form with fields for student details and a table displaying student information.

Uploaded by

kadiyamkarthik09
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/ 2

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>University Home</title>
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<script>
function showSection(sectionId) {
document.getElementById('about').style.display = 'none';
document.getElementById('courses').style.display = 'none';
document.getElementById('contact').style.display = 'none';
document.getElementById(sectionId).style.display = 'block';
}
</script>
<style>
.content-section { display: none; }
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container">
<a class="navbar-brand" href="#">
<img src="logo.png" alt="University Logo" width="50" height="50"> University
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-
target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item"><a class="nav-link" href="#"
onclick="showSection('about')">About</a></li>
<li class="nav-item"><a class="nav-link" href="#"
onclick="showSection('courses')">Courses</a></li>
<li class="nav-item"><a class="nav-link" href="#"
onclick="showSection('contact')">Contact</a></li>
</ul>
</div>
</div>
</nav>

<div class="container text-center my-5">


<h1>Welcome to Our University</h1>
<p>Providing quality education and research opportunities.</p>
</div>

<div class="container my-5 content-section" id="about">


<h2>About Us</h2>
<p>Our ###college content$####<\p>
</div>
<div class="container my-5 content-section" id="courses">
<h2>Our Courses</h2>
<p>We##cntnt###.</p>
</div>

<div class="container my-5 content-section" id="contact">


<h2>Contact Us</h2>
<p>Email: [email protected]</p>
<p>Phone: +123 456 7890</p>
</div>

<footer class="bg-dark text-white text-center p-3">


&copy; 2025 University Name. All Rights Reserved.
</footer>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, <meta name="viewport" content="width=device-width,
initial-scale=1.0"> initial-scale=1.0">
<title>Student Table</title> <title>Student Registration</title>
<style> <link
table { href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css
width: 50%; /bootstrap.min.css" rel="stylesheet">
margin: 20px auto; </head>
border-collapse: collapse; <body>
} <div class="container mt-5">
table, th, td { <div class="card p-4 shadow-sm">
border: 1px solid black; <h2 class="text-center mb-4">Student Registration</h2>
} <form>
th, td { <div class="form-group">
padding: 8px; <input type="text" class="form-control"
text-align: center; placeholder="Student Name" required>
} </div>
th { <div class="form-group">
background-color: #f2f2f2; <input type="text" class="form-control"
} placeholder="VTU Number" required>
</style> </div>
</head> <div class="form-group">
<body> <select class="form-control" required>
<option value="">Department</option>
<table> <option>CSE</option>
<tr> <option>ECE</option>
<th>Roll No</th> <option>EEE</option>
<th>Name</th> <option>Mechanical</option>
<th>Class</th> <option>Civil</option>
</tr> </select>
<tr> </div>
<td>VTU0001</td> <div class="form-group">
<td>AAAA</td> <select class="form-control" required>
<td>II CSE</td> <option value="">Year</option>
</tr> <option>1st Year</option>
<tr> <option>2nd Year</option>
<td>VTU0004</td> <option>3rd Year</option>
<td>SSSS</td> <option>4th Year</option>
<td>III CSE</td> </select>
</tr> </div>
<tr> <div class="form-group">
<td>VTU0007</td> <input type="tel" class="form-control"
<td>GGGG</td> placeholder="Mobile Number" required pattern="^\d{10}$">
<td>IV CSE</td> </div>
</tr> <div class="form-group">
<tr> <input type="email" class="form-control"
<td>VTU0010</td> placeholder="Email" required>
<td>VVVV</td> </div>
<td>I CSE</td> <button type="submit" class="btn btn-primary btn-
</tr> block">Register</button>
</table> </form>
</body> </div>
</html> </div></script>
</html>

You might also like