practical 12th code
practical 12th code
DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head> <body>
<h1>My first <br> website</h1>
<div id="div1">
<h2>Home</h2>
<h4>This is my first webpage! I was able to code all the HTML and CSS
in order to make it. Watch out world of web design here I come</h4>
</div>
<div id="div4">
<a
href="https://www.landrover.in/vehicles/new-range-rover/index.html"
target="_blank">CONTACT</a>
</div>
<div id="div3">
<a href="https://www.lexus.com/" target="_blank">ABOUT</a>
</div>
<div id="div2">
<a href="https://www.toyota.com/grsupra/" target="_blank">HOME</a>
</div>
</body> </html>
*{
background-color: grey;
}
h1 {
position: relative;
left: 40px;
}
#div1 {
padding: 20px;
width: 80%;
position: absolute;
left: 85px;
background-color: whitesmoke;
bottom: 0px;
}
h2{
background-color: whitesmoke;
}
h4{
background-color: whitesmoke;
}
#div2 {
padding: 10px;
padding-top: 30px;
padding-bottom: 30px;
margin: 10px;
width: 10%;
text-align: center;
background-color: yellowgreen;
position: absolute;
top: 5%;
right: 175px;
}
#div3 {
padding: 10px;
padding-top: 30px;
padding-bottom: 30px;
margin: 10px;
width: 10%;
text-align: center;
background-color: yellowgreen;
position: absolute;
top: 5%;
right: 10px;
}
#div4 {
padding: 10px;
padding-top: 30px;
padding-bottom: 30px;
float: right;
margin: 10px;
width: 10%;
text-align: center;
background-color: yellowgreen;
position: absolute;
top: 20%;
right: 10px;
}
a{
background-color: yellowgreen;
border: 0px;
color: black;
text-decoration: none;
}