html 鼠标碰到下拉菜单的文字会明显往前移动怎么解决！！！
HTML<divclass="nav"><ul><ahref=""><liclass="l">首页</li></a><ahref=""><liclass="l">柳铁概况...
HTML<div class="nav"> <ul> <a href=""><li class="l">首页</li></a> <a href=""><li class="l">柳铁概况 <ul class="gaikuo"> <a href="xixi.html"><li class="l">学校概况</li></a> <a href=""><li class="l">现任领导</li></a> <a href=""><li class="l">发展规划</li></a> <a href=""><li class="l">历史沿革</li></a> <a href=""><li class="l">学校章程</li></a> <a href=""><li class="l">校园美景</li></a> <a href=""><li class="l">全景VR</li></a> </ul> </li></a> <a href=""><li class="l">机构设置</li></a> <a href=""><li class="l">招生就业</li></a> <a href=""><li class="l">教学科研</li></a> <a href=""><li class="l">人才培养</li></a> <a href=""><li class="l">合作交流</li></a> <a href=""><li class="l">校友总会</li></a> <a href=""><li class="l">校园文化</li></a> <a href=""><li class="l">专题栏目</li></a> </ul> </div> CSS.nav{ height:45px; width:100%; line-height:45px; background:#007cc2;}.nav ul{ margin-left:5px;}.nav li{ text-align:center; width:99px;}.nav a{ font-weight:bold; color:#fff;}.nav li:hover{ background:#e98304;}.gaikuo li:hover{ background:#c86d04;}.gaikuo{ font-size:10px; display:none;}.nav li:hover .gaikuo{ display:inline;}
展开
展开全部
a标签是不能嵌套a标签的，建议你修改一下
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
* {
margin: 0;
padding: 0;
}
.nav {
height: 45px;
line-height: 45px;
background: #007cc2;
}
.nav .ul {
float:left;
position:relative;
margin-left: 5px;
}
.nav .li {
text-align: center;
width: 99px;
}
.nav .a {
font-weight: bold;
color: #fff;
}
.nav .li:hover {
background: #e98304;
}
.ul .li:hover .gaikuo{
display:block;
}
.gaikuo {
display: none;
position:absolute;
z-index:999;
top:100%;
left:0;
width:100%;
font-size: 10px;
background: #c86d04;
}
</style>
</head>
<body>
<div class="nav">
<div class="ul">
<a href="#" class="a">首页</a>
</div>
<div class="ul">
<div class="li">
<a href="#" class="a">刘铁概括</a>
<div class="gaikuo">
<div class="li">
<a href="#" class="a">学校概况</a>
</div>
<div class="li">
<a href="#" class="a">发展规划</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
* {
margin: 0;
padding: 0;
}
.nav {
height: 45px;
line-height: 45px;
background: #007cc2;
}
.nav .ul {
float:left;
position:relative;
margin-left: 5px;
}
.nav .li {
text-align: center;
width: 99px;
}
.nav .a {
font-weight: bold;
color: #fff;
}
.nav .li:hover {
background: #e98304;
}
.ul .li:hover .gaikuo{
display:block;
}
.gaikuo {
display: none;
position:absolute;
z-index:999;
top:100%;
left:0;
width:100%;
font-size: 10px;
background: #c86d04;
}
</style>
</head>
<body>
<div class="nav">
<div class="ul">
<a href="#" class="a">首页</a>
</div>
<div class="ul">
<div class="li">
<a href="#" class="a">刘铁概括</a>
<div class="gaikuo">
<div class="li">
<a href="#" class="a">学校概况</a>
</div>
<div class="li">
<a href="#" class="a">发展规划</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
追问
刚才我的问题解决了 但是又出现新的问题，在IE7-IE9浏览器中下拉菜单出现问题一直解决不了又不清楚，新手一个。按照你的方法改了后，问题解决了，谢了
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
