使用纯CSS制作二级导航菜单栏,通过改变列表的样式实现。核心在于鼠标移到和移出目标时菜单栏的高度!
<html>
<head>
<title>Secondary Navigation Menu</title>
</head>
<style>
body{ background-color:white;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
magin:0px;
padding:0px;
}
ul,li{
margin:0px;
padding:0px;
}
#nav{
padding:5px;
position:absolute;
z-index:1;
left:200px;
top:200px;
}
li{
display:inline;
list-style:none;
list-style-position:outsite;
text-align:center;
font-weight:bold;
float:left;
}
a:link{
color:#000;
text-decoration:none;
width:100px;
padding:3px 5px 0px 5px;
}
a:vi