关于坛友的一个布局问题的解答

来源: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实现网页爬虫方式小结


 关于坛友的一个布局问题的解答

你可能感兴趣的:(问题)