Question

我需要为列表项添加偏移量，但我还没有看到任何可以执行此操作的属性（不推荐使用标记偏移量除外）。在我的例子中，我有一个递归建立列表的方法，在每个新列表中我需要添加偏移量。

我使用剃刀视图，因此我有一个名为with list的方法：

<ul>
   @showMenu(Model, string offset)
</ul> 
@helper showMenu(List<MyViewModel> model){
foreach(var category in Model){
if(category.idParentCategory==0){
   continues; //break point
}
<li>
    @if(category.childCategories.Count()!=0){
    <ul>
       @showMenu(Model, offset) //offset to be changed for next iteration
    </ul>
</li>

这是我的viewmodel：

public class CategoryModel
{
    public long idCategory { get; set; }
    public string name { get; set; }
    public string path{ get; set; }
    public int idParentCategory { get; set; }
    public int order { get; set; }
    public List<CategoryModel> childCategories { get; set; }
    public List<DocumentModel> childDocuments { get; set; }
}

每个类别都有childCategories / childDocuments。这是DocumentModel：

public class DocumentModel
{
    public long idDocument { get; set; }
    public long idCategory { get; set; }
    public string docName { get; set; }
    public string link { get; set; }
    public string type { get; set; }
}

谢谢！

Answer 1

对于递归列表，只需嵌套列表即可。

使用padding-left向li添加标记与列表项之间的间距。

要在标记和页面边缘之间添加间距，请使用margin-left ul。

＆＃13;

ul.class1 {
  background-color: yellow;
  margin-left: 15px;
}

.class1 li {
  background-color: red;
  padding-left: 20px;
}

ul.class2 {
background-color:green;
  margin-left: 10px;
}

.class2 li {
  background-color: blue;
  padding-left: 0px;
}

＆＃13;

<ul class="class1">
  <li> One item </li>
  <li> Two item </li>
  <li> Three item
    <ul class="class2">
      <li> Three sub item 1 </li>
      <li> Three sub item 2 </li>
    </ul>
  </li>
  <li> Four item </li>
</ul>

＆＃13;

如何在列表项中添加偏移量？

1 个答案: