Question

我需要图片显示在多行中。问题是我必须在一个大循环和溢出：auto中完成所有操作。反正我还能这样做吗？这是代码：

<div class="horizontal2">
              <ul>
                <li>
                  <?php for ($i=0; $i <60; $i++): ?>                             
                    {{ user:profile }}
                      <img class="picformatting" src="{{ profile_picture:image }}" />
                    {{ /user:profile }}                                   
                  <?php endfor;?>
                </li>
              </ul>
            </div>

这是CSS（horizontal2）：

.horizontal2{
  list-style: none;
  width: 100%;
  overflow: auto;
  padding-left: 0;

}

Answer 1

li#container {
   width:400px;
   height:auto;
}
li#container img {
   display:inline-block;
   width:37px;
   height:37px;
   margin:3px;
}

您可以使用display:inline-block属性。它将进行调整，如果超过10个图像在行中，则它将强制执行到另一行。

Answer 2

怎么样：

<?php
$max_img = 10;
?>
<?php for ($i=0; $i <60; $i++): ?>
    {{ user:profile }}
        <img class="picformatting" src="{{ profile_picture:image }}" />
        <?php if(fmod($i, $max_img) == 0) echo "<br/>"; ?>
    {{ /user:profile }}                                   
<?php endfor;?>

当然，它不是自动模式，但可以是“解决方案”......

如何在一个循环中创建具有溢出的行

2 个答案: