两种排列方法。 - 走看看

zoukankan html css js c++ java

两种排列方法。
第一种：用float:left
123

123

123
123

123

123
123

123

123
第二种，用margin-left为负值来处理
- qwe
- qwe
- qwe
- rty
- rty
- rty
- yui
- yui
- yui
<!DOCTYPE html>
<html>
<head>
    <title>列</title>
    <meta charset="utf-8"/>
     <style style="text/css">
         div{float:left;}
     </style>
     <style>
       #lie{line-height: 3em;}
       .e{margin-left: 80px;}
       .f{margin-left: 160px;}
       li.top { margin-top:-9em;}
     </style>
</head>
<body>
  <p>第一种：用float:left<span style="line-height: 1.5;"> </span></p>

  <div>
      <ul>
         <li class="a">123</li>
         <li class="a">123</li>
         <li class="a">123</li>
      </ul>
  </div>
  <div>
       <ul>
         <li class="b">123</li>
         <li class="b">123</li>
         <li class="b">123</li>
       </ul>
   </div>
   <div>
        <ul>
         <li class="c">123</li>
         <li class="c">123</li>
         <li class="c">123</li>
        </ul>
   </div>
<br />
<br />
<br />
<p> </p>
<hr />
  <p>第二种，用margin-left为负值来处理</p>
         <ul id="lie">
            <li class="d">qwe</li>
            <li class="d">qwe</li>
            <li class="d">qwe</li>
            <li class="e top">rty</li>
            <li class="e">rty</li>
            <li class="e">rty</li>
            <li class="f top">yui</li>
            <li class="f">yui</li>
            <li class="f">yui</li>
         </ul>
 <hr />
</body>
</html>
查看全文

相关阅读:
checkedListBox的具体用法
 pi
从1.9G到64K
世界编程大赛第一名程序
 SQLServer中导入/导出Excel的基本方法
 Android 内存优化测试
 android,内存优化详解
 Android解决大图片内存溢出
 Android有效解决加载大图片时内存溢出的问题
 android端读取本地图片出现OutOfMemoryException

原文地址：https://www.cnblogs.com/liurenxingyu/p/4607021.html

Copyright © 2011-2022 走看看