192: Ict final exam
<!DOCTYPE html>
<title>M. Umar Chaudhry</title>
<style>
* {
margin: 0px;
padding: 0px;
}
body {
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.6)), url(https://images.pexels.com/photos/1097456/pexels-photo-1097456.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
background-size: cover;
}
.container {
height: 25vh;
display: flex;
justify-content: space-between;
align-items: center;
}
img {
width: 230px;
margin-left: 80px;
cursor: pointer;
}
.item {
display: flex;
align-items: center;
font-size: 25px;
font-family: cursive;
margin-right: 130px;
list-style-type: none;
}
a {
margin-right: 45px;
color: antiquewhite;
text-decoration: none;
}
.content {
position: absolute;
top: 50%;
width: 100%;
text-align: center;
transform: translateY(-35%);
color: antiquewhite;
font-family: cursive;
font-size: 23px;
letter-spacing: 1px;
}
.content p {
font-family: cursive;
font-size: 18px;
letter-spacing: 2px;
line-height: 25px;
}
button {
width: 150px;
font-size: 17px;
padding: 12px;
text-align: center;
margin: 20px 10px;
border-radius: 30px;
font-weight: bold;
border: 2px solid rgb(41, 253, 80);
background: transparent;
color: antiquewhite;
cursor: pointer;
}
</style>
</head>
<body>
<div class="container">
<img src="https://c4.wallpaperflare.com/wallpaper/904/353/85/republic-of-gamers-wallpaper-preview.jpg" alt="logo">
<ul class="item">
<li><a href="#"><b>home</b></a></li>
<li><a href="#"><b>about</b></a></li>
<li><a href="#"><b>services</b></a></li>
<li><a href="#"><b>blog</b></a></li>
<li><a href="#"><b>contact</b></a></li>
</ul>
</div>
<div class="content">
<h1 style="color: rgb(41, 253, 80);"> ICT Lab Final Exam </h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. <br> At provident veniam quisquam perferendis
distinctio delectus doloremque <br> amet magnam porro repellat beatae corrupti sint voluptatum ipsam <br>
autem quae tempore, culpa fugiat?</p>
<button>Login</button>
<button>Sign in</button>
</div>
</body>
</html>
Comments
Post a Comment