Question

我尝试了在Stack Overflow和其他地方找到的各种解决方案，但没有任何效果。我用foreach循环列出我的项目，它们垂直显示但我希望它们水平列出。

这是我视图中的代码：

<ul>
    @foreach(var item in Model)
    {
        <li>
            <h3>@Html.DisplayFor(modelItem => item.Title)</h3>       <br />
            @Html.DisplayNameFor(model => model.VariesUntil): @Html.DisplayFor(modelItem => item.VariesUntil)  <br />
            @Html.DisplayNameFor(model => model.ZipId): @Html.DisplayFor(modelItem => item.ZipId)    <br />
        </li>
    }
</ul>

Answer 1

ul li {display：inline; }

在你的CSS中可以解决问题。

Answer 2

尝试

ul li {display:inline-block;}

jsfiddle

@ HukurHaf的答案是正确的，除非li内没有H3或输入标签。

所以

<ul>
  <li>1</li>
  <li>2</li>
</ul>

带有display:inline;的

将并排呈现，但是当您放置H3或输入标签时，它将不会并排呈现。

如何在ASP.NET MVC中水平列出项目？

2 个答案: