• 分类导航菜单的制作(附源码)--HTML


    不多说,直接贴代码哈!有疑问,可追加评论哈!

    demo.html:

    <!DOCTYPE html>
    <html>
    <head>
      <title>分类导航菜单</title>
      <meta charset="utf-8">
      <meta name="keywords" content="keyword1,keyword2,keyword3">
      <meta name="description" content="this is my page">
      <meta name="content-type" content="text/html; charset=UTF-8">
      <link href="css/demo.css" rel="stylesheet" text="text/css"/>
    </head>
    <body>
      <nav>
        <ul>
          <li></li>
          <li><a href="#">新闻热点</a></li>
          <li><a href="#">招聘求职</a></li>
          <li><a href="#">问答求助</a></li>
          <li><a href="#">生活服务</a></li>
          <li><a href="#">开心灌水</a></li>
          <li><a href="#">商务合作</a></li>
          <li><a href="#">教育培训</a></li>
          <li><a href="#">创业专区</a></li>
        </ul>
      </nav>
    </body>
    </html>

    demo.css:

    @CHARSET "UTF-8";
    *{padding:0;margin:0;}
    nav{border:1px solid #BCFF1D;font-size:12px;background:#D6FF8C url(../images/background.gif)
    no-repeat top left;float:left;height:128px;}
    nav ul{list-style:none;312px;margin:2px;}
    nav ul li{104px;float:left;height:45px;text-align:center;line-height:35px;}
    nav ul li a{background:url(../images/menu.gif) no-repeat;display:block;text-decoration:none;color:black;padding-left:18px;}
    nav ul li a:hover,nav ul li a:active{background-position:0px -55px;color:#ff3300;font-weight:bold;}

    Effect picture:

    源码文件下载:分类导航菜单.zip

  • 相关阅读:
    解决Android SDK Manager更新、下载速度慢
    selenium报错以及各解决方法
    webdriver对各种浏览器的支持
    selenium driver版本和Chrome浏览器版本对应关系
    selenium web driver
    js中变量注意事项
    js选项卡实现
    两种JS方法实现斐波那契数列
    三种JS方法确定元素在数组中的索引值
    javascript内置属性——arguments
  • 原文地址:https://www.cnblogs.com/qikeyishu/p/7666008.html
Copyright © 2020-2023  润新知