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

Question

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

因此，例如，第一个li元素的字体大小为18px，那么嵌套元素的字体大小为16px，并且任何嵌套元素的字体大小为14px等。但是，一旦字体大小达到一定大小例如8px我想停止让它们变小。

这些列表在飞行中生成，所以我无法知道它们会变得如此之深，所以不能只是将css硬编码到某个级别。有没有一种方法在CSS或JQuery中我可以应用这种类型的格式？

Answer 1

您可以定义字体大小以百分比为单位，将级联：

li { font-size: 90%; } 

编辑：

我想那将是更好地界定手动四个层次：

li { font-size: 16px } 
li li { font-size: 14px } 
li li li { font-size: 12px } 
li li li li { font-size: 10px } 
li li li li li { font-size: 8px } 

顺便提一下，请记住，有些浏览器允许用户定义最小字体大小。例如，我把它设置为12px。

Answer 2

li { font-size: 90%; } 

第一个li将获得90％，一个嵌套在90％以下的90％之下，等等。

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

...停止4级后。