Question

在js bin上查看我的代码示例： http://jsbin.com/iritep/3/edit

我想缩小黄色项目而不继续我的硬编码css规则：

ul li a {padding-left: 20px;}
ul li ul li a {padding-left: 40px;}
ul li ul li ul li a {padding-left: 60px;}
ul li ul li ul li ul li a {padding-left: 80px;}   /* don't want this line! */

我是否可以在不添加最后一行css的情况下使这个css更具动态性？

Answer 1

对不起，Stackoverflow不允许我在这么短的时间内发表两次评论。这是解决我问题的链接。

http://jsbin.com/iritep/5/edit#javascript,html,live

Answer 2

稍微更改您的css规则，您可以执行以下操作：

ul li{
  padding-left:20px;
}

这将进一步缩小每个新级别20px。看，如果那仍然适合你。（缩进列表通常会带来一些较小的样式限制（例如通过li或a元素对单行进行着色。）

具有缩进动态填充的嵌套列表

2 个答案: