Question

我试图用剃刀动态创建行但我无法弄清楚如何包装它。我想要的是我的模型中的每个5：e对象我想创建一个新的行/ div import java.util.Scanner; public class Minutes { public static void main(String[] args) { //User information Scanner in = new Scanner(System.in); System.out.println("Please enter a number of hours, days, weeks or years: "); int s = in.nextInt(); //Compute input int hours = s * 60; int days = s * 1440; int weeks = s * 10080; int years = s * 525600; //Print results System.out.println("------------------------------------------------"); System.out.println("Here are your results!"); System.out.println("If you entered hours, this is the number of minutes" + ": " + hours); System.out.println("If you entered days, this is the number of minutes" + ": " + days); System.out.println("If you entered weeks, this is the number of minutes" + ": " + weeks); System.out.println("If you entered years, this is the number of minutes" + ": " + years); } }，以便每行包含五个或更少的图像。

<div class="row pics_in_a_row">

奖金问题：如何获取图片的高度和宽度并将其添加到calc（）css？

Answer 1

您应该在循环中添加类row pics_in_a_row的div

这应该为每5个项目创建一个行（当剩余项目小于5时，最后一行为更少）。

<div class="container">
    @{
        var numberOfColsNeeded = 5;
        var totalCounter = Model.images.Count();
        var itemCounter = 1;
    }
    @foreach (var item in Model.images)
    {
        if (itemCounter % numberOfColsNeeded == 1)
        {
            @:<div class="row pics_in_a_row">
        }
        <div class="flxbox" style="flex: calc(1024 / 713)">
           <img src="@item.LowResolution" class="img-fluid rounded flximg" />
        </div>
        if ((itemCounter % numberOfColsNeeded == 0) || ((itemCounter) == totalCounter))
        {
           @:</div>
        }
        itemCounter++;
    }
</div>

如何使用razor动态创建行

1 个答案: