如何显示数组中项目数量可变的布局 (PHP)

Question

如果我给你 array 个对象，让我们假设有 x 个对象，你将如何使用网格系统执行以下操作（bootstrap，基础 ... 不会事):

遍历数组并创建复制的内容：

不，我已经能够通过以下方式创建它：

echo "<div class='row'>";
    for($i = 0; $i < count($options['fields']); $i++) {

        // Increate the value of I and convert it from 1 to one.
        $numberToWord = new FreyaTheme\NumberToWord\Conversion();
        $wordRepersentation = $numberToWord->convert($i + 1);

        if (isset($options['fields']['logo_image_' . $wordRepersentation])) {
            if ($i <= 2) {
                echo '<div class="medium-4 columns r3x1">';
                    echo '<img src="'.$options['fields']['logo_image_' . $wordRepersentation].'" />';
                echo '</div>';
            } else if ($i <= 6) {
                echo '<div class="medium-3 columns r4x1">';
                    echo '<img src="'.$options['fields']['logo_image_' . $wordRepersentation].'" />';
                echo '</div>';
            } else if ($i <= 9) {
                echo '<div class="medium-4 columns r3x1">';
                    echo '<img src="'.$options['fields']['logo_image_' . $wordRepersentation].'" />';
                echo '</div>';
            }
        }
    }
echo "</div>";

现在这个，虽然这里的逻辑有点混乱 - 适用于 10 个项目。现在想象一下我给你 800。或 8 或 2 或 1 或......你明白了。无论我给你多少物品，这个图案，这个盒子布局都需要重复。我不管你给我6个还是6000个对象

我可以用 10 来做这个，但我不知道如何缩放它。想法？

Answer 1

好吧，这是一个解决方案。 Ofc 你必须自己让它响应并使用 css 类而不是内联 css:

<div style="padding: 5px; text-align:center;">
    <?php
    for($i = 0; $i < 5; ++$i)
    {
    ?>
    <div>
    <?php
        //output 3
        if ($i%2 == 0)
        {
            for($cell=0;$cell<3;++$cell)
            {
            ?>
            <div style="display:inline-block; border:1px solid #000; width: 200px; margin-bottom: 10px;">
                <span style="padding: 40px; display:inline-block; text-align:center;">350*150</span>
            </div>
            <?php
            }
        }
        //output 4
        else
        {
            for($cell=0;$cell<4;++$cell)
            {
            ?>
            <div style="padding: 5px; display:inline-block; border:1px solid red; width: 138px; margin-bottom: 10px;">
                <span style="padding: 30px; display:inline-block; text-align:center;">350*150</span>
            </div>
            <?php
            }
        }
    ?>
    </div>
    <?php
    }
    ?>
</div>

如何显示数组中项目数量可变的布局 (PHP)

How do Display A Layout With a Variable Number of Items in an Array (PHP)

html

php

arrays

zurb-foundation