ASSIGNMENT-
NAME: Ankit
CLASS: B1
ROLL no.: 2204920100022
Q1. Control the repetition of the image with the
background-repeat property.
<html>
<head>
<style
> body
{
background-image:
url("[Link]"); background-
repeat:no-repeat ;
background-size:auto;
background-position: center;
}
</style>
</head>
<body>
</body>
</html>
OUTPUT
Q2. Define styles for links using pseudo
classes:
•a:link
•a:visited
•a:active
•a:hover
<!DOCTYPE html>
<html>
<head>
<style>
/* unvisited link
*/ a:link {
color: blue;
}
/* visited link
*/ a:visited {
color: green;
}
/* mouse over link */
a:hover {
color: yellow;
}
/* selected link
*/ a:active {
color: red;
}
</style>
</head>
<body>
<h2>Styling a link depending on state</h2>
<p><b><a href="[Link]
target="_blank">This is a link</a></b></p>
<p><b>Note:</b> a:hover MUST come after a:link and a:visited in
the CSS definition in order to be effective.</p>
<p><b>Note:</b> a:active MUST come after a:hover in the CSS definition
in order to be effective.</p>
</body>
</html
OUTPUT
Q3. Design a website that contains a horizontal navigation bar
using an unordered list.
• Include the logo, the college name, and
links to the homepage, login page,
registration page, catalog page, and cart page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
font-family:'Times New Roman', Times,
serif; margin: 0;
padding: 0;
background-color:#fff;
}
header {
display: flex;
justify-content:
center; align-items:
center;
gap: 800px;
background-color:
#333; color: #fff;
padding: 10px 0;
text-align: center;
}
h1{
background-color:
black; color: red;
}
nav {
background-color:
blue; text-align:
center;
}
form {
margin: 0;
padding: 0;
}
form button {
background-color:
blue; color: yellow;
border: none;
padding: 16px 20px;
text-decoration:
font-size:
15px; margin:
0;
cursor: pointer;
}
form button:hover {
background-color: #555;
}
.logo {
display: inline-
block; margin-right:
10px;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img src="[Link]" alt="Logo" width="50">
</div>
<h1>KCC Institute of Technology and Management
</h1>
</header>
<nav>
<form>
<button type="button">Home</button>
<button type="button">Login</button>
<button type="button">Registration</button>
<button type="button">Catalogue</button>
<button type="button">Cart</button>
</form>
</nav>
<p>KCC Institute of Technology and Management is located in Greater
Noida,
Uttar Pradesh. It is one of the sister institutes for engineering and
management studies under KCC institutions. It has approvals from the All
India Council of
Technical Education (AICTE) and UGC and affiliation from Dr APJ
Abdul Kalam Technical University (AKTU).
KCC Institute of Technology and Management offers UG and PG-level
courses, namely, [Link]., M. Tech., and MBA. KCC ITM BTech admissions
are based on JEE Main score followed by UPTAC Counselling. Check KCC ITM
Admissions
Every year, the placement cell of KCC Institute of Technology and
Management assists the students in getting job offers from top recruiters,
like
Cognizant, Indus Bank, Capgemini, Philips, etc. In the previous year, the
maximum placement was from IT, telecommunication, and power and energy
departments. The
B. Tech course also includes an internship in the pre-final year at
industries, like Unitech, Accenture, HCL, etc.</p>
</body>
</html>
OUTPUT
