Question

CSS重置后的事件，我发现IE显然在SUP标签上附加了一些默认样式。在以下示例中，SUP标记仍然比样式化的SPAN标记略小。有没有人知道这个调整？

<!doctype html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css"/>
        <style type="text/css">
            sup { font-size: 16px; vertical-align: super; }
            .trademark { font-size: 16px; vertical-align: super; }
        </style>

    </head>

    <body>

        <h1>This is a <sup>®</sup> test</h1>

        <h1>This is a <span class="trademark">®</span> test</h1>

    </body>

</html>

Answer 1

http://jsfiddle.net/utwSv/

你应该养成给字体提供百分比大小的习惯，特别是在使用CSS重置设置字体大小百分比之后。

在上面的示例中，如果我为子元素设置120％的字体大小，它对我来说没问题。但之后我也改变了h1标签的大小。如果我使用固定的字体大小（以像素为单位），则子元素仍会显示较小的字体。相反，如果我将其设置为百分比值，它将正确显示。

注意我还包括了CSS字体的YUI重置。

CSS重置后，两个元素上的相同样式不同（仅限IE）

1 个答案: