css – 我可以在页面上而不是跨越div来传输div吗?

前端之家收集整理的这篇文章主要介绍了css – 我可以在页面上而不是跨越div来传输div吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如果我有一个div元素的集合,我可以使用CSS让它们流过页面并溢出到下一行.

这是一个简单的例子:

<html>
  <head>
    <title>Flowing Divs</title>
    <style type="text/css">
      .flow {
        float: left;
        margin: 4em 8em;
      }
    </style>
  </head>
  <body>
    <div class="container">
      <div class="flow">Div 1</div>
      <div class="flow">Div 2</div>
      <div class="flow">Div 3</div>
      <div class="flow">Div 4</div>
      <div class="flow">Div 5</div>
      <div class="flow">Div 6</div>
      <div class="flow">Div 7</div>
      <div class="flow">Div 8</div>
    </div>
  </body>
</html>

是否有可能让div向下流动而不是跨越它,这样它们就会沿着不沿线的列向下流动,但仍然占据与它们流过时相同的空间?

所以对于上面的例子,如果他们流入两行四个div,我可以让第一列包含Div1和Div2而不是Div1和Div5吗?

解决方法

快速把它扔在一起:
#column1 {float:left}  
#column2 {float:left}  
div div{height:100px;width:100px;border:1px solid}

<div id="column1">    
      <div>1</div>  
      <div>2</div>  
</div>  
<div id="column2">  
      <div>3</div>  
      <div>4</div>  
</div>

猜你在找的CSS相关文章