h5+css 垂直导航菜单

矫情吗;* 2022-09-23 03:39 300阅读 0赞

垂直导航菜单

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>导航菜单</title>
  6. <style type="text/css"> *{ margin:0;padding:0;font-size:15px;} ul{ list-style:none;width:100px;background-color:#ccc;} a{ text-decoration:none;color:#333;} .nav li a{ height:33px;width:100px;line-height:33px;margin-bottom:1px;background-color:#efefef;display:block;text-indent:20px;} .nav li a:hover{ background-color:#f66;color:#fff;} </style>
  7. </head>
  8. <body>
  9. <ul class="nav">
  10. <li><a href="#">首  页</a></li>
  11. <li><a href="#">新闻快讯</a></li>
  12. <li><a href="#">产品展示</a></li>
  13. <li><a href="#">售后服务</a></li>
  14. <li><a href="#">联系我们</a></li>
  15. </ul>
  16. </body>
  17. </html>

效果图:
这里写图片描述

发表评论

表情:
评论列表 (有 0 条评论,300人围观)

还没有评论,来说两句吧...

相关阅读