用行</up>填充<ul>缩进

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！