Question

我有一个用户列表的以下网格布局：

col-xs-4 col-sm-4 col-md-3 col-lg-2

之前我只使用col-md-2并使用$counter来确定何时需要开始新行，以及何时结束现有行：

    while ($row = $business_query->fetch_assoc()){
        if ($counter % USERS_PER_ROW == 0){
            $business_div .= "<div class=\"row\">";    
        }

        $business_div .= "<div class=\"col-xs-4 col-sm-4 col-md-3 col-lg-2 user-container vertical-align\">
            <a href=\"#\">
                <div class=\"user-content\">
                    <div class=\"user-img\">
                    </div>
                    <div class=\"user-text v-h-align\">"
                    .$row["username"].
                    "</div>
                </div>
            </a>
        </div>";

    if ($counter % USERS_PER_ROW == USERS_PER_ROW - 1 || $counter == $num_business - 1){
        $business_div .= "</div>";
    }
    $counter++;

我只想设置USERS_PER_ROW = 6;，一切都会好的。但是，当我有4种不同的布局时，如何动态地完成它？

Answer 1

将它设为一行，bootsrtap将动态包装列。 Afaik，它不可能只在PHP中你想要的，因为你想要的是在客户端通过boottrap完成，PHP不知道它是xs还是sm，还是lg。

我有时会这样做，如果我想要每行一定数量的cols，对于特定大小，我会对索引执行模数运算，并为该视图大小插入br，例如：

<br class="clearfix visible-xs-block">

这将进行剪切，或者您可以将其设为div而不是br，这是一个仅在特定屏幕尺寸上可见的分隔符。

PHP Bootstrap以不同的网格大小结束一行

1 个答案: