asp.net-mvc-3 – 在Razor视图中显示List元素

发布时间：2020-12-16 06:37:55 所属栏目：asp.Net 来源：网络整理

导读：我将一个列表传递给Controller的视图.如何通过使用模型传递生成以下类型的 HTML ……. . 我尝试使用以下代码,但它生成一个垂直列表,而我希望它是水平和垂直.这是我的代码.您将如何编写自己的内容以实现上述输出 @foreach (var cats in Model){ li@cats.Categ

我将一个列表传递给Controller的视图.如何通过使用模型传递生成以下类型的 HTML …….
.

我尝试使用以下代码,但它生成一个垂直列表,而我希望它是水平和垂直.这是我的代码.您将如何编写自己的内容以实现上述输出

@foreach (var cats in Model)
{
    <li>@cats.CategoryName</li>
}

解决方法

你需要将这个标记与一些css结合起来：

<ul class="two-columns clearfix">
@foreach (var cats in Model)
{
    <li>@subcats.CategoryName</li>
}
</ul>

然后CSS：

ul.two-columns li
{
    width: 50%;
    float: left;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

/* Clear Fix */
.clearfix:after
{
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}


* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!