Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
membuat menu drop down
saya mau tanya bagaimana cara nya supaya menu saat di hover bacground warna sama warna tulisan nya berubah saya coba kok gk bisa- bisa mohon bantuannya
<!DOCTYPE html>
<html>
<heade>
<meta charset="UTF-8">
<title>membuat menu</title>
<style type="text/css">
*{
margin:0;
padding: 0;
}
#wrappper{
font-family: sans-serif, tahoma;
font-size: 12px;
border:2px solid grey;
width: 70%;
height: 1000px;
}
header{
width:900px;
height:168px;
border: 1px solid grey;
text-align: center;
position: relative;
margin-left: 16%;
margin-bottom: 15px;
}
img{
width:900px;
height:167px;
}
nav > ul > li{
float: left;
width:26%;
border-right:3px solid yellow;
}
nav li{
list-style: none;
text-align: center;
background:black;
font-family: tahoma;
font-size: 14px;
height: 40px;
line-height: 40px;
border-radius:5px;
}
li:last-child{
border:none;
}
nav li ul{
display: none;
}
nav li:hover{
background: yellow;
color:black;
}
nav ul li a:hover{
color:black;
}
nav ul li:hover ul{
display: block;
color:black;
}
nav li ul li{
border-top:1px solid black;
border-bottom:1px solid white;
}
nav ul li a{
text-decoration: none;
color:yellow;
font-weight:bold;
}
</style>
</heade>
<body>
<div id="wrapper">
<header>
<img src="media/header.jpg" width="900" height="170">
</header>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Kategori</a>
<ul>
<li><a href="#">Html</a></li>
<li><a href="#">Css</a></li>
<li><a href="#">JavaScript</a></li>
</ul>
</li>
<li><a href="#">About</a></li>
</ul>
</nav>
</div>
</body>
<html>
0
4 Jawaban:
1. itu agan nulis tag head nya salah hehehe :D 2. sebenarnya pengen jelasin satu persatu tapi bingung jelasinnya gimana, jadi ane kasih code nya aja buat perbaikan gan.. maaf ya bukan maksud bikin agan malas :D
di bagian header tag scriptnya sehabis
nav li
agan bisa ganti ini..
nav li:last-child{
border:none;
}
nav ul li:hover {
background: yellow;
}
nav li:hover a {
color: black;
}
nav ul li a{
text-decoration: none;
color: yellow;
font-weight: bold;
}
nav ul li ul{
display: none;
}
nav ul li:hover ul{
display: block;
}
nav li ul li{
border-top:1px solid black;
border-bottom:1px solid white;
}
nav ul li:hover ul li a {
color: yellow
}
semoga jelas dan bisa dipelajari hehehe
0
waduh terima kasih banget yah saya ceroboh hahaha terima kasih banyak yah, semangat belajar :v
0
kalo udah terjawab jangan lupa ditandai mas :)
0