11

在使用不等于 1 的 em 时使所有嵌套列表项的大小相同的最有效方法是什么。例如,我希望此列表中的所有 li 的大小都为 ul 父级的 0.85em。我是否必须为每个深度“级别”创建一个单独的类?

<html>
<head>
    <style type="text/css">
        li
        {
            font-size: 0.85em;
        }
    </style>
</head>
<body>
    <ul>
        <li>Level 1 item
            <ul>
                <li>Level 2 item
                    <ul>
                        <li>Level 3 item</li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</body>
</html>
4

7 回答 7

9

使用“rem”单位进行字体大小调整。这解决了字体继承问题。

Johnathan Snook 对此有一篇很棒的文章

于 2011-07-09T21:16:53.480 回答
7

应该管用。

li li {font-size: 100%;}
于 2009-07-23T20:36:38.800 回答
0

我的建议是给第<ul>一个 id 或类,并在font-size那里设置。

于 2009-07-23T20:12:34.387 回答
0

(此答案假设您希望所有 li 元素的大小相同(您都说您想要相同的大小,而问题中的大小不同))

字体大小的级联,所以如果你只是将它设置在外部元素上(比如一个包装 div 或其他东西),它里面的所有东西都会像你想要的那样(我认为)小一步。

<div id="navigation">
    <ul>
        <li>...</li>
        <li>
        <ul><li>...</li><li>...</li></ul>
        </li>
    </ul>
</div>

#navigation { font-size: 0.85em; }
于 2009-07-23T20:12:43.513 回答
0

我同意 Emil 的观点,如果我有足够的代表点数(这里是 n00b),我会投票给他。我会使用他在第一点中提到的类,因此它可以在同一个文档中重复使用。如果您想要跨浏览器并使用当前的 css 规范,那么我不能建议一个更好的现实世界示例.....滚动 css 3 和 IE6 的死亡!

于 2009-07-23T21:21:47.557 回答
-1

我希望此列表中的所有 li 的大小都为 ul 父级的 0.85em

body > ul { font-size: 0.85em; }

会那样做

于 2009-07-23T20:09:16.953 回答
-1
li { font-size: 0.85em; }
li li { font-size: 1em; }
于 2009-07-23T20:12:33.187 回答