HTML 结构
<div class="box">
<ul class="nav">
<li>
<a href="#">钉钉</a>
<ul>
<li>测试</li>
<li>明天你好</li>
<li>今天再见</li>
</ul>
</li>
<li>
<a href="#">微信</a>
<ul>
<li>明天你好</li>
<li>今天再见</li>
<li>测试</li>
</ul>
</li>
<li>
<a href="#">扣扣</a>
<ul>
<li>今天再见</li>
<li>测试</li>
<li>明天你好</li>
</ul>
</li>
</ul>
</div>
CSS样式布局
<style>
*{
margin: 0;
padding: 0;
}
li{
list-style-type: none;
cursor: pointer;
}
a{
text-decoration: none;
color: #404060;
}
.box{
width: 500px;
margin: 100px auto;
}
.box>ul>li