zoukankan      html  css  js  c++  java
  • 简单的css 菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <style>
    .sub-nav{
        position: relative;
        border-bottom: 1px solid #E3E6EA;
        height:42px;
        font-family:"Microsoft YaHei", simsun;    
    }

    .sub-nav ul{
        padding:14px 0px 0px 25px;
    }
    .sub-nav ul li{
        float:left;
        line-height:14px;
        color:#5f727f;
        border-right: 1px solid #dcdde0;
        curson: pointer;
    }
    ul, ol{
        list-style:outside none none;    
    }
    .sub-item-in{
        margin-left:0;
    }
    .sub-nav ul li .sub-item-in{
        padding:0 6px;
        margin: 0 5px;
        position:relative;
        font-size:14px;
    }
    .sub-nav .trans {
        position: absolute;
        height: 3px;
        background: none repeat scroll 0% 0% #5EB5F1;
        overflow: hidden;
        left: 25px;
        bottom: -1px;
        68px;
        font-size: 0px;
        line-height: 0;
    }
    .has-trans {
        transition: all 0.3s ease-out 0s;
    }
    </style>

    </head>
    <body>
    <div class="sub-nav">
        <ul>
            <li><span class="sub-item-in" data-spm-click="gostr=/tbtrip;locaid=d101">Guo Nei</span></li>
            <li><span class="sub-item-in" data-spm-click="gostr=/tbtrip;locaid=d102" data-type="iflight">HongKong</span></li>
            <li><span class="sub-item-in" data-spm-click="gostr=/tbtrip;locaid=d103" data-type="flightCheap">Special Price</span></li>
            <li><span class="sub-item-in" data-spm-click="gostr=/tbtrip;locaid=d104" data-type="iflightCheap">International Special Price</span></li>
        </ul>
         <div style="left: 25px; 40px;" class="trans has-trans J_TransBar"></div>
    </div>
    </body>
    </html>

  • 相关阅读:
    JPA注解 @DiscriminatorValue 使用
    随笔
    Win10 启用 FTP
    Java后端模拟前端请求
    ueditor上传路径改成绝对路径
    CSS Web Fonts 网络字体
    调试:'Object reference note set to an instance of an object.'
    类转json、 json转xml的方法,转SortedDictionary转 xml 的方法。
    xml的问题 XmlDocument 与json转换
    websocket
  • 原文地址:https://www.cnblogs.com/BenWong/p/4196259.html
Copyright © 2011-2022 走看看