zoukankan      html  css  js  c++  java
  • 关于坛友的一个布局问题的解答

    来源:http://www.ido321.com/1147.html

    需求:让select、ul、文字、button、text显示在一行中,效果戳:http://bbs.csdn.net/topics/390915380?page=1#post-398415668

     

    我的实现例如以下

    HTML:

    <!DOCTYPE html>
    
    <html>
    
     <head>
    
        <title>Test</title>
    
         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      
     </head>
    
      <body>
      <div class="main">
          <div class="pagediv">
              <ul>
                  <li><a href=""></a></li>
                  <li><a href="">1</a></li>
                  <li><a href="">2</a></li>
                  <li><a href="">3</a></li>
                  <li><a href="">4</a></li>
                  <li><a href=""></a></li>
              </ul>
          </div>
          <div class="seldiv">
              每页
              <select>
                  <option>20</option>
                  <option>30</option>
                  <option>50</option>
              </select>
              记录跳转至第<input type="text"><input type="button" value="Go">
          </div>
      </div>
    </body>
    
     </html>

    CSS:

    ul
        {
            list-style: none;
        }
        .pagediv
        {
            float: left;
        }
        ul li
        {
            float: left;
        }
        a
        {
            text-decoration: none;
            display: block;
            border: 1px solid #ccc;
            text-align: center;
            line-height: 24px;
            width: 24px;
            height: 24px;
        }
        a:hover
        {
            text-decoration: none;
            color: red;
        }
        .seldiv
        {
            float: left;
            margin: 20px;
        }

    效果:


    下一篇:网页抓取:PHP实现网页爬虫方式小结


  • 相关阅读:
    #pragma
    STL~heap
    codeforces682A
    POJ1753(位操作和枚举)
    位运算
    getchar()(转)
    UVA2636
    UVA2639
    UVA2322
    UVa2521
  • 原文地址:https://www.cnblogs.com/wzzkaifa/p/6903102.html
Copyright © 2011-2022 走看看