怎么才能正常显示
.nav{
width: 100%;
height: 45px;
background-color: #449FE6;
}
.menu {
width:1170px;
height:45px;
background-color:#449FE6;
margin:0 auto;
}
.menu ul li{
float:left;
width:105px;
height:45px;
color:#FFFFFF;
margin-left:12px;
text-align:center;
line-height:45px;}
.menu a {
display: block;
padding-left:15px;
color: #fff;
}
.menu a:hover {
display:block;
width:85px;
height:45px;
background-color:#013C76;
}
div.menu-list {
border-right:#d6d6d6 1px solid;
padding-right:0px; border-top:#d6d6d6 1px solid;
display:none; padding-left:0px;
filter:alpha(opacity=80);
padding-bottom: 5px; border-left:#d6d6d6 1px solid;
width:100px;
padding:0px;
background-color:#013C76;
color:#FFFFFF;
border-bottom:#d6d6d6 1px solid;
position: absolute;
opacity: 0.8;
}
div.menu-list ul {
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
margin: 0px;
padding-top: 0px;
}
div.menu-list ul li {
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
margin: 0px;
padding-top: 0px;
}
div.menu-list ul li {
margin-left:2px;
margin-top:5px;
font-size:12px;
text-align:center;
line-height:24px;
list-style-type: circle;
}
div.menu-list ul li a {
display: block;
width: 100%;
cursor:pointer;
color: #FFFFFF;
line-height: 25px;
height: 25px;
text-align: center;
text-decoration: none;
}
div.menu-list ul li a span {
display: block;
width: 100%;
height: 100%
}
div.menu-list ul li a:hover {
display:block;
width:90px;
height:24px;
background:#449FE6;
font-size:12px;
text-align:center;
line-height:24px;
margin-left:2px;
margin-top:5px;
}`
<div class=menu>
<ul>
<li class=select><a href="">首页</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onmouseover="mouseover(this, 1)" onmouseout=mouseout()><a href="">机构介绍</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onMouseOver="mouseover(this, 2)" onmouseout=mouseout()><a href="">产品检测</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onMouseOver="mouseover(this, 3)" onmouseout=mouseout()><a href="">技术服务</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onMouseOver="mouseover(this, 4)" onmouseout=mouseout()><a href="">质量鉴定</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onMouseOver="mouseover(this, 5)" onmouseout=mouseout()><a href="">科研标准</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onMouseOver="mouseover(this, 6)" onmouseout=mouseout()><a href="">新闻咨询</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onMouseOver="mouseover(this, 7)" onmouseout=mouseout()><a href="">专题专栏</a></li>
<li style="width:2px;padding-top:8px;"><img src="images/b.png" /></li>
<li onMouseOver="mouseover(this, 8)" onmouseout=mouseout()><a href="">联系我们</a></li>
</ul>
</div>
<div class=menu-list id=menu1 onmouseover=_mouseover() onmouseout=_mouseout()>
<ul>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a></li>
</ul>
</div>
<div class=menu-list id=menu2 onmouseover=_mouseover() onmouseout=_mouseout()>
<ul>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a></li>
</ul>
</div>
<div class=menu-list id=menu3 onmouseover=_mouseover() onmouseout=_mouseout()>
<ul>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href=""><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
</li>
</ul>
</div>
<div class=menu-list id=menu4 onmouseover=_mouseover() onmouseout=_mouseout()>
<ul>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
</li>
</ul>
</div>
<div class=menu-list id=menu5 onmouseover=_mouseover() onmouseout=_mouseout()>
<ul>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
</li>
</ul>
</div>
<div class=menu-list id=menu6 onmouseover=_mouseover() onmouseout=_mouseout()>
<ul>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
</li>
</ul>
</div>
<div class=menu-list id=menu7 onmouseover=_mouseover() onmouseout=_mouseout()>
<ul>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
<li><a href="#"><span>二级菜单栏目</span></a>
</li>
</ul>
</div>`function getOffsetTop (el, p) {
var _t = el.offsetTop;
while (el = el.offsetParent) {
if (el == p) break;
_t += el.offsetTop;
}
return _t;
};
function getOffsetLeft (el, p) {
var _l = el.offsetLeft;
while (el = el.offsetParent) {
if (el == p) break;
_l += el.offsetLeft;
}
return _l;
};
var tt;
var curMenu;
function mouseover (th, menu) {
if (tt) clearTimeout(tt);
displayMenu(false);
menu = document.getElementById('menu' + menu);
menu.style.left = getOffsetLeft(th) + 'px';
menu.style.top = getOffsetTop(th) + th.offsetHeight + 'px';
curMenu = menu;
displayMenu(true);
}
function mouseout () {
tt = setTimeout('displayMenu(false)', 200);
}
function _mouseover () {
if (tt) clearTimeout(tt);
displayMenu(true);
}
function _mouseout () {
displayMenu(false);
}
function displayMenu (display) {
if (curMenu) {
curMenu.style.display = display ? 'block' : 'none';
}
}
function doZoom(size){
document.getElementById('textbody').style.fontSize=size+'px'
}
不止是头部的问题啊，只给头部这段代码的话
给你二级菜单设置z-index:99999试试