PHP:在li中创建行和列类

时间:2013-11-22 11:14:27

标签: php

有20李

  <ul>
      <li id="1"></li>
      <li id="2"></li>
      <li id="3"></li> <!--- Row1--->

      <li id="4"></li>
      <li id="5"></li>
      <li id="6"></li><!--- Row2--->

      <li id="7"></li>
      <li id="8"></li>
      <li id="9"></li><!--- Row3--->

      <li id="10"></li> 
      <li id="11"></li>
      <li id="12"></li><!--- Row4--->
  </ul>

我想给第一个3 li元素1,2,3到第1行

 li 4,5,6 to row 2

有可能用李??

 <?php $i=0;?>

<ul>
  <?php foreach($data as $da):?>
     <li id="<?php echo $i+1;?>"></li>
  <?php $i++; ?>
  <?php endforeach; ?>
</ul>

4 个答案:

答案 0 :(得分:1)

<style>
.row { float:left; }
.row > ul { display:inline-block; }
</style>
<ul>
  <?php

  $i=0;
  foreach($data as $da){    
     if($i%3===0){
          echo ($i!==0 ? '</ul>' : null );
          echo "<li class='row'><ul><li id='".($i+1)."'></li>";
     }else{
          echo "<li id='".($i+1)."'></li>";
     }
     $i++;
  }
  ?>
</ul>

您可能还需要引入clearfix类。

答案 1 :(得分:0)

无序列表中没有'行'。

您当然可以根据序列对元素应用类,并且可以将“rowEnd”或“rowStart”类应用于该行中的最后一个或第一个列表项而不会有太多麻烦,但是您想要实现的是什么?将它们分组成行?

对于这种类型的数据,表格听起来更自然吗?

修正后的答案:

<?php

    $data = array();
    $data = array_pad($data, 50, 'x'); // Just creating some dummy data..

?>
<?php $i=0;
    $row = 1; // First row as default...

?>

<ul>
  <?php foreach($data as $da):?>
    <?php
        if(($i > 2 && $i % 3 == '0')) { // Increment where $i is divisble by 3
            $row++;
        }
    ?>
     <li class="row<?=$row?>" id="<?php echo $i+1;?>"><?=$da?></li>
  <?php $i++; ?>
  <?php endforeach; ?>
</ul>

答案 2 :(得分:0)

我不确定你要做什么,但我理解i want to give class to first 3 li element

那么为什么不检查你的迭代是否低于3?(迭代0,1,2)

<ul>
    <?php foreach($data as $da):?>
        <?php if($i < 3) :?>
            <li class="yourClass" id="<?php echo $i+1;?>">Got class</li>
        <?php else :?>
            <li id="<?php echo $i+1;?>">No class</li>
        <?php endif;?>
        <?php $i++; ?>
    <?php endforeach; ?>
</ul>

如果你想从每个'行'获得前3个li。那么在没有列表的列表中没有行。您可以为此创建表格,也可以创建多个代表“行”的<ul>

答案 3 :(得分:0)

为什么不关闭你的ul,然后带上另一个ul。然后以正确的间距浮动你的ul。

<?php $i=0;?>
<?php $x=0;?>
<ul>
  <?php foreach($data as $da):?>
     <li id="<?=$i+1;?>"></li>
     <?php if ($x == 2) {
      echo "</ul><ul>";
      $x = 0;     
     ?>
  <?php $i++; $x++ ?>
  <?php endforeach; ?>
</ul>