html - 填用行缩进

Question

<UL>是否可以用一条线（或点或其他什么）填充缩进？

html

<ul>Foo
   <ul>Bar
      <ul>Foo
      </ul>
   </ul>
</ul>

结果

Foo 
-----Bar 
----------Foo

Answer 1

这不是一个通用的解决方案，而是一个快速的胜利：

HTML：

<ul>Foo
   <ul>Bar
      <ul>Foo
      </ul>
   </ul>
</ul>

CSS：

ul {
    margin: 0;
    padding: 0;
}
ul > ul:before {
    content: "------";
}

ul > ul > ul:before {
    content: "------------";
}

在这个jsFiddle中亲自看看！