zoukankan      html  css  js  c++  java
  • 3层下拉列表

    ,1,建3层列表

    <title>无标题文档</title>
    <style>
    *{
    margin:0px;
    padding:0px;}
    .a{
    border:0;
    height:50px;
    200px;
    top:100px;
    left:100px;
    background-color:#0C0;
    text-align:center;
    vertical-align:middle;
    overflow:hidden;
    line-height:50px;
    position:absolute

    }
    .aa{
    border:0;
    height:50px;
    200px;
    top:100px;
    left:100px;
    background-color:#FF6;
    text-align:center;
    vertical-align:middle;
    overflow:visible;
    line-height:50px;
    position:absolute

    }
    .b{
    border:0 ;
    height:50px;
    200px;
    top:50px;

    background-color:#636;
    text-align:center;
    vertical-align:middle;
    overflow:hidden;
    line-height:50px;
    position:absolute
    }
    .bb{
    border:0;
    height:50px;
    200px;
    top:50px;

    background-color:#93F;
    text-align:center;
    vertical-align:middle;
    overflow:visible;
    line-height:50px;
    position:absolute
    }
    .c{
    border:0;
    height:50px;
    200px;
    top:100px;

    background-color:#9FC;
    text-align:center;
    vertical-align:middle;

    line-height:50px;
    position:absolute
    }
    .d{
    border:0;
    height:50px;
    200px;
    top:150px;
    background-color:#F0C;
    text-align:center;
    vertical-align:middle;
    line-height:50px;
    position:absolute
    }
    #b{
    border:1px;
    height:150px;
    200px;
    top:0px;
    left:200px;
    text-align:center;
    vertical-align:middle;
    position:absolute;
    }

    </style>

    </head>

    <body>
    <div class="a" onmouseover="this.className='aa'" onmouseout="this.className='a'">滚动新闻

    <div class="b" onmouseover="this.className='bb'" onmouseout="this.className='b'" >娱乐
    <div id="b">
    <table cellpadding="0px" cellspacing="0px">
    <tr><td bgcolor="#339933" width="200px">2</td></tr>
    <tr><td bgcolor="#99FF66" width="200px">4</td></tr>
    <tr><td bgcolor="#FF00CC" width="200px">6</td></tr>

    </table></div>

    </div>
    <div class="c">民生</div>
    <div class="d">军事</div>
    </div>

    </div>

  • 相关阅读:
    hdu 6440 Dream(费马小定理+构造)
    [POJ3107]Godfather
    [POJ2488]A Knight's Journey
    [POJ3009]Curling 2.0
    [BZOJ1040][CODEVS1423][ZJOI2008]骑士
    [BZOJ1103] [POI2007]大都市meg
    BZOJ1827 [Usaco2010 Mar]gather 奶牛大集会
    [codevs1286]郁闷的出纳员
    [codevs3044]矩形面积求并
    BZOJ4563[Haoi2016]放棋子
  • 原文地址:https://www.cnblogs.com/wanlibingfeng/p/5325892.html
Copyright © 2011-2022 走看看