<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./renwu.css">
<style>
p{
font-weight: bold;
}
</style>
</head>
<body>
<div id="box1">
<ul>
<li><a href="">What's new</a>
<div id="box2">
<ul>
<li><p>HOME</p></li>
<li>Pampers Diapers</li>
<li>Huggies Diapers</li>
<li>Seventh Generation</li>
<li>Diapers</li>
<li>Derbies</li>
<li>Driving shoes</li>
<li>Espadrilles</li>
<li>Loafers</li>
</ul>
<ul>
<li><p>HOME</p></li>
<li>Driving shoes</li>
<li>Espadrille</li>
<li>Loafers</li>
<li><p>HOME</p></li>
<li>Driving shoes</li>
<li>Espadrilles</li>
<li>Loafers</li>
</ul>
<ul>
<li><p>HOME</p></li>
<li>Pampers Diapers</li>
<li>Huggies Diapers</li>
<li>Seventh Generation</li>
<li>Diapers</li>
<li>Derbies</li>
<li>Driving shoes</li>
<li>Espadrilles</li>
<li>Loafers</li>
</ul>
<ul>
<li id="qqq">RELATED</li>
<li>CATEGORIES</li>
<li>Pampers Diapers</li>
<li>Huggies Diapers</li>
<li>Diapers</li>
<li id="eee">BRANDS</li>
<li>Driving shoes</li>
<li>Espadrilles</li>
</ul>
</div>
</li>
<li><a href="">Top rated</a></li>
<li><a href="">Earnings</a></li>
<li><a href="">Rings</a></li>
<li><a href="">Bracelets</a></li>
<li><a href="">All Categories</a></li>
</ul>
</div>
</body>
</html>
*{
margin: 0;
padding: 0;
}
ul>li{
list-style: none;
}
#box1>ul>li{
/* list-style: none; */
border: 1px solid white;
}
#box1{
width: 900px;
height: 80px;
background-color: black;
margin: 0 auto;
}
#box1>ul>li{
width: 16%;
height: 80px;
text-align: center;
line-height: 80px;
float: left;
font-size: 20px;
}
a{
text-decoration: none;
color: blueviolet;
}
li:hover{
background-color: pink;
}
#box1>ul>li:hover a{
color: red;
/* font-size: 25px; */
}
#box2{
background-color: blanchedalmond;
width: 900px;
height: 350px;
display: none;
}
#box1>ul>li:hover #box2{
display: block;
}
#box2>ul{
width: 223px;
height: 350px;
/* border: 1px solid black; */
float: left;
}
#box2 ul li{
color: grey;
text-align: center;
font-size: 15px;
height: 40px;
line-height: 40px;
}
#box2>ul>#qqq{color: orange; font-weight: bold;}
#box2>ul>#eee{color: orange; font-weight: bold;}
956
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
