zoukankan      html  css  js  c++  java
  • 导航条

    CSS文件

    body,div,ul,li{padding:0; margin:0;}

    #nav{
    800px;
    height:35px;
    background:#CCC;
    margin:0 auto;/*上下为:0;左右自动匹配浏览器*/
    margin-top:30px;
    }

    #nav ul{
    800px;
    height:35px;
    }

    #nav ul li{ float:left;}/*这个是消除快元素的霸性*/

    #nav ul li{
    100px;
    float:left;
    list-style:none;/*专门针对火狐浏览器自带默认样式表的<li>标签*/

    line-height:35px;/*这个要去看一本书是关于文字垂直对齐的*/
    text-align:center;
    padding:0 15px;/*上下为:15px;左右为:0*/
    }

    a{font-size:10px;}

    #nav ul li a{display:block; height:35px; color:#333;
    text-decoration:none; float:left; padding:0 10px;}

    #nav ul li a:hover{color:#fff; text-decoration:underline;
     background:#000;}

    HTML中

    <head>
     <link type="text/css" rel="stylesheet" href="1.css"/>
    </head/>
    <body>
     <div id="nav">
      <ul>
      <li><a href="#">CSS 学习</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>
     </div>
    </body>

  • 相关阅读:
    TweenMax 前台脚本库
    如何使用CSS Sprites技术进行图片合并
    QQ群开放接口
    使用 Hexo 生成一套静态博客网页
    把表插入数据库
    WCF
    SOA
    登录验证
    登录菜单权限验证
    GetJsonByDataTable
  • 原文地址:https://www.cnblogs.com/meroselove/p/1871732.html
Copyright © 2011-2022 走看看