返回作业 下拉菜单...登陆

作业 下拉菜单

太早2019-07-02 12:07:2276
<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>Document</title>
   <style>
       ul{
           list-style: none;
       }
       .nav>li{
           float: left;
       }
       ul a{
           display: block;
           text-decoration: none;
           width: 100px;
           height: 50px;
           text-align: center;
           line-height: 50px;
           color: white;
           background-color: #2f3e45;
       }
       .nav>li:first-child a{
           border-radius: 10px 0 0 10px;
       }
       .nav>li:last-child a{
           border-radius: 0 10px 10px 0;
       }
       .drop-down{
           /*position: relative;*/
       }
       .drop-down-content{
           padding: 0;
           display: none;
           /*position: absolute;*/
       }

       h3{
           font-size: 30px;
           clear: both;
       }
       .drop-down-content li:hover a{
           background-color:red;
       }
       .nav .drop-down:hover .drop-down-content{
           display: block;
       }
   </style>
</head>
<body>
<ul>
   <li><a href="#">下拉菜单</a></li>
   <li><a href="#">下拉菜单</a>
       <ul>
           <li><a href="#">我是1</a></li>
           <li><a href="#">我是2</a></li>
           <li><a href="#">我是3</a></li>
       </ul>
   </li>
   <li><a href="#">下拉菜单</a></li>
   <li><a href="#">下拉菜单</a></li>
   <li><a href="#">下拉菜单</a></li>
</ul>
<h3>我是测试文字</h3>
</body>
</html>


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送
  • PHP中文网