A:今天学到的内容
一、实现下拉菜单(运用float,position)
<style>
*{margin: 0;padding: 0}
ul{list-style: none;}
li{float: left;}
.navBox{background-color: pink}
.nav{
margin-right: auto;margin-left: auto;
width: 1000px;text-align: center;line-height: 50px;
}
.nav:after{
content: "";
display: table;
clear: both;
}
.nav a{
text-decoration: none;
display: block;
width: 120px;
}
.menu{
position: relative;
}
.content{
position: absolute;
display: none;
background-color: palevioletred;
}
.menu:hover .content{
display: block;
}
.nav a:hover{
background-color: gainsboro;
}
</style>
<div class="navBox">
<ul class="nav">
<li class="menu">
<a href="">收藏夹</a>
<div class="content">
<a href="">我的宝贝</a>
<a href="">收藏的宝贝</a>
</div>
</li>
<li><a href="">卖家中心</a></li>
<li><a href="">联系我们</a></li>
<li><a href="">商城</a></li>
</ul>
</div>
B:学会了什么
一、实现下拉菜单(运用float,position)
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。