<<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head>
<title>530</title>
<link rel="stylesheet" type="text/css" href="html.css">
</head>
<body>
<div id="school"></div>
<div class="nav">
<ul>
<li><a href="">我的大学</a></li>
<ul>
<li><a href="">学校概况</a></li>
<li><a href="">校园风光</a></li>
<li><a href="">BT DOWN</a></li>
</ul>
</ul>
</div>
</body>
</html>
*
{
font-family: 楷体;
}
body
{
font-color:rgb(35,35,35);
}
ul
{
list-style:none;
}
a
{
text-decoration: none;
}
#school
{ width:669px;
height:104px;
background-image:url("../个人HTML/校徽.png");
background-repeat: no-repeat;
margin:auto;
}
.nav
{
width: 100%;
height:40px;
background-color:rgb(224,223,228);
}
.nav ul
{
width: 100px;
margin: auto ;
text-decoration: none;
}
.nav ul li
{
margin-left: 10px;
float: left;
text-decoration: none;
}
.nav ul li a
{
width: 100px;
height:30px;
padding-top: 10px;
color: white;
margin:0px 10px;
font-size: 15px;
display: block;
text-align: center;
text-decoration: none;
}
.nav ul li a:hover
{
background-color: rgb(104,140,140);
}
/*1*/
.nav ul li ul
{
display: none;
}
.nav ul li:hover ul
{
display: none;
width: 100px;
background-color: rgb(224,223,228);
position: relative;
}
.nav ul li:hover ul li
{
display: none;
width: 100px;
height: 20px;
font-size:12px;
text-align: center;
background-color: rgb(224,223,228);
}
.nav ul li:hover ul li a:hover
{
border-color: rgb(104,140,140);
}
结构都错了吧,ul怎么嵌入ul中了。。
.nav ul li ul
{
displaxy: none;
margin-left:10px;
padding:0;
width: 100px;
background-color: rgb(224,223,228);
position: relative;
}
.nav ul li:hover ul{display:block}
.nav ul li ul li
{
float:none;
font-size:12px;
width:auto;
text-align: center;
margin:0;
background-color: rgb(224,223,228);
}
.nav ul li:hover ul li a:hover
{
border-color: rgb(104,140,140);width:auto;display:block;margin:0px;
}
<ul>
<li><a href="">我的大学</a>
<ul>
<li><a href="">学校概况</a></li>
<li><a href="">校园风光</a></li>
<li><a href="">BT DOWN</a></li>
</ul></li>
</ul>