0% found this document useful (0 votes)
10 views

CSS Practical 2

Uploaded by

tanvi rastogi
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)
10 views

CSS Practical 2

Uploaded by

tanvi rastogi
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/ 6

2.

Add appropriate CSS code to change the text, list, div element and table properties of the

HTML questions above.

<html>

<head>

<title>Department Website</title>

<style>

margin: 0;

padding: 0;

box-sizing: border-box;

header {

background-color: #333;

color: #fff;

padding: 10px 0;

text-align: center;

nav {

background-color: #444;

padding: 10px 0;

text-align: center;

nav ul {

list-style-type: none;

nav ul li {

display: inline;

margin-right: 20px;

}
nav ul li a {

color: #fff;

text-decoration: none;

padding: 5px 10px;

.dropdown {

position: relative;

.dropdown-content {

display: none;

position: absolute;

background-color: #444;

min-width: 160px;

z-index: 1;

.dropdown:hover .dropdown-content {

display: block;

.dropdown-content a {

color: #fff;

padding: 12px 16px;

text-decoration: none;

display: block;

.dropdown-content a:hover {
background-color: #555;

body {

font-family: Arial, sans-serif;

line-height: 1.6;

background-color: #f4f4f4;

color: #333;

padding: 20px;

h1, h2, h3 {

margin-bottom: 20px;

p{

margin-bottom: 10px;

ul {

margin-bottom: 20px;

table {

width: 100%;

border-collapse: collapse;

margin-bottom: 20px;

th, td {

padding: 8px;
border-bottom: 1px solid #ddd;

th {

background-color: #444;

color: #fff;

text-align: left;

.container {

max-width: 1200px;

margin: 0 auto;

.section {

background-color: #fff;

padding: 20px;

margin-bottom: 20px;

border-radius: 5px;

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

</style>

</head>

<body>

<header>

<h1>Department of Microbiology</h1>

</header>

<nav>

<ul>

<li><a href="#">Home</a></li>

<li class="dropdown">
<a href="#">Faculty</a>

<div class="dropdown-content">

<a href="#">Professor A</a>

<a href="#">Professor B</a>

<a href="#">Professor C</a>

</div>

</li>

<li><a href="#">Courses</a></li>

<li><a href="#">Activities</a></li>

<li><a href="#">Syllabus</a></li>

<li><a href="#">Notifications</a></li>

</ul>

</nav>

<div class="container">

<section class="section">

<h2>Welcome to our Department!</h2>

<p>Microbiology is a broad discipline encompassing the fields of Biotechnology, Molecular


Biology, Bioinformatics, Biochemistry Virology, Bacteriology and Cell Biology. Department of
Microbiology at RLA College started in 1989. It has a dynamic and dedicated teaching faculty.

</p>

</section>

</div>

</body>

</html>

You might also like