Paano po ba maging katulad ng h1 ko yung footer yung kagaya ng h1 ko na may navigation at hover effect
Tingnan niyo yung footer po paano po yun?
HTML:
<Doctype html>
<html>
<head>
<title> my blog site </title>
<style>
body {
background-color:pink;
}
h1 { color:steelblue;
font-family:raleway;
font-size:200%;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
top: 0;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: turquoise;
}
.active {
background-color: steelblue;
}
p {
border:5px solid steelblue;
padding:10px;
margin:30px;
}
div {
width: 320px;
padding: 10px;
border: 5px solid Turquoise;
margin: 30px;
}
div {
list-style-type: none;
}
</style>
</head>
<body>
<div class=the"container 1">
<h1> My blog site
<ul>
<li><a href="#Content">home</a>
</li>
<li><a href="#Content">gallery</a>
</li>
<li> <a href="#Content">about</a>
</li>
</ul>
</h1>
</div>
<div class="container 1">
<p> lorem ipsum </p>
</div>
<div class="container 2">
<p> lorem ipsum</p>
</div>
<div class="social media">
<ul>
<li> instagram </li>
<li> Facebook </li>
<li> gmail </li>
</ul>
</div>
</body>
</html>
Tingnan niyo yung footer po paano po yun?