设置
  • 让页面同时显示两列
  • 今天在做网站的时候有一个小模块的布局问题,然我头疼了半天,不过最后还是解决了,我想显示的效果如下图所示 :

     设置<li>让页面同时显示两列

    下面举个例子来说明是怎么实现的:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>LI列表自动排成两列显示</title>
    <style type="text/css">
    <!--
    body {font:12px/1.5em "Lucida Grande", Verdana, sans-serif; }
     #list {width: 600px;float:left; list-style:disc outside; color:#000; }
     #list li {float:left;}
      #list li a{display:block;float:left; width: 300px; }
    -->
    </style>
    </head>
    <body>
     <ul id="list">
    <li><a href="http://songjindian.iteye.com" target="_blank">《Java2核心技术卷2:高级特性》第7版中文高清 PDF</a></li><li><a href="http://songjindian.iteye.com" target="_blank">ASP结合Ajax实现草稿自动保存系统</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">jQuery 多项选择功能的表格</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">带后台管理的ASP+jS动感相册</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">基于JavaScript的Tween算法及曲线特效</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">C#编程获取局域网IP及网卡MAC地址</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">Asp生成静态HTML完整实例(包括列表分页)</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">信友拼客(圈子交友)程序 v2.1</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">JavaScript开发的拼音输入法[精品]</a></li>
    <li><a href="http://songjindian.iteye.com" target="_blank">ASP+AJAX无刷新评论提交</a></li>
     </ul>
    </body>
    </html>

     这个希望在以后的使用中能够用到。

    你可能感兴趣的:(JavaScript,jquery,编程,Ajax,asp)