zoukankan      html  css  js  c++  java
  • 导航条的制作(css)

    一、在做导航条的时候,通过用css怎么让经过的a元素的边框颜色发生改变呢?

    二、遇到的问题是重合的边框总是解决不好,然后解决的办法是

         先确定让他们的右边框与下一个元素的左边框重合。

        层级的先后顺序 a:hover{z-index: 1}

    三、z-index必须在定位元素上才能奏效,所以定义了a的定位。最后问题解决了。

    <!DOCTYPE html>
    <html>
    <head>
     <title>滚动条的样式制作练习</title>
     <meta charset="utf-8">
     <style type="text/css">
            *{margin:0;padding:0;}
            .nav{position: absolute;top:50px;left:30px;}
            .nav a{position:relative;float: left;display: block;height: 30px;line-height: 30px;padding:10px;text-decoration: none;
             border:1px solid #000;margin-left: -1px;}
             a:nth-last-child(1){border:1px solid #000; }
             a:hover{z-index: 1;border-color: red;} 
     </style>  
    </head>
    <body>
    <div class="nav">
     <a href="#">首页</a>
     <a href="#">新闻</a>
     <a href="#">指南</a>
     <a href="#">专题</a>
     <a href="#">关于我们</a>
    </div>
    </body>
    </html>

  • 相关阅读:
    如何修改mysql root密码
    【STL】list基础(转)
    时间控制timer settimeout setinterval
    刷新ArrayCollection的显示控件
    需要科普的网站
    flex 拖拽数据
    常用的资源网站
    as3 性能优化
    对象池
    Bitmap与Bitmapdata
  • 原文地址:https://www.cnblogs.com/syp1/p/4885090.html
Copyright © 2011-2022 走看看