想要的效果是,鼠标在菜单悬浮出现下拉菜单。
还有能具体给我代码参考吗?就基于作业的代码,
万分感谢
2018-03-28 11:43:06
在源代码上添加的效果代码是没有的哦,给你写了一个使用:hover伪类的方式,实现下拉菜单,可以照着这个布局方式来,自己要动手做一做哦,参考:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
ul,
li {
list-style: none;
}
header {
width: 1000px;
height: 100px;
background-color: #000;
line-height: 100px;
margin: 0 auto;
}
ul.link {
text-align: center;
}
ul.link>li {
position: relative;
float: left;
width: 80px;
margin: 0 20px;
color: #fff;
}
ul.link .list {
position: absolute;
top: 100px;
left: 0;
width: 80px;
color: #000;
display: none;
}
ul.link>li:hover .list {
display: block;
}
</style>
</head>
<body>
<header>
<ul class="link">
<li>
<span>首页</span>
<ul class="list">
<li>aa</li>
<li>aa</li>
</ul>
</li>
<li>
<span>免费</span>
<ul class="list">
<li>bb</li>
<li>bb</li>
</ul>
</li>
</ul>
</header>
</body>
</html>
2018-03-28 13:42:36
我套用到我的里面还是不能实现啊,有更好的交流方式吗?
因为最近我再弄一个完整的网页,问题挺多的,在mooc这样问答太不方便了。
2018-03-28 14:33:12
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星