如何让列表前显示图片？

<ul>
 <li>一级目录</li>
 <ul>
  <li>二级目录a</li>
  <li>二级目录b</li>
 </ul>
</ul>

如何我想用图片代替默认的图形，我可以这么做：

ul {
list-style-type:none;
list-style-image:url(square.gif);
}

但是，我发现一点，默认情况下，一级目录和二级目录前面的图形是有区别的。而当我用图片来代替时，图片都是一样的。这样就没有那种层次感，感觉不是很好。有没有办法针对不同层次用不同的图片来代替？