css - 更改列表中嵌套元素的字体大小

Question

我有一个 ul 元素的嵌套列表。我想为每个级别将字体大小减小几个像素。

因此，例如，第一个 li 元素的字体大小为 18px，然后其嵌套元素的字体大小为 16px，其任何嵌套元素的字体大小为 14px 等。但是，一旦字体大小达到一定大小，例如8px 我不想再让它们变小了。

这些列表是动态生成的，所以我无法知道它们会有多深，所以不能只是将 css 硬编码到某个级别。在 css 或 JQuery 中有没有一种方法可以应用这种格式？

Answer 1

li { font-size: 90%; }

第一个 li 将获得 90%，嵌套在其下方的一个将获得 90% 中的 90%，依此类推。

li li li li { font-size: 100%; } 

... 4 级后停止。