为什么HTML中Legend标签在IE和其他浏览器中的文字颜色不同

Question

为什么HTML中Legend标签在IE和其他浏览器中的文字颜色不同

6

也许我错过了一些非常明显的东西，但为什么以下HTML会在Internet Explorer中以蓝色显示图例文本，而在其他浏览器中以黑色显示？

<html>
    <head>
    </head>
    <body>
        <fieldset font-italic="True">
            <legend style="font-size: 24px; font-weight: bolder;">This is a test</legend>
        </fieldset>
    </body>
</html>

我希望网页在不同的浏览器中显示的颜色都是一致的，因此我将颜色明确设置为黑色。但我很好奇为什么会出现这种差异。

- MisterXero

3个回答

3

不同的浏览器有不同的默认样式。这就是为什么有些人（但不包括我）使用类似雅虎这个CSS重置样式表的原因。

编辑：

我不喜欢使用重置样式，因为它会添加许多你可能不需要的规则，并且其中很多规则将被覆盖，这会给用户的浏览器增加额外的工作量（该浏览器可能比你的机器慢）。我更喜欢在我的CSS中非常明确，以确保我已经涵盖了所有情况，但如果您想使用它，我认为没有任何问题。

- Paul

谢谢提供链接！我以前没有使用过重置样式表，但是我正在为所有页面使用样式表。我只是觉得奇怪的是IE选择使用蓝色作为默认颜色，而其他浏览器似乎大多使用黑色。 - MisterXero

最重要的是记住填充和边距，我认为在CSS样式表的顶部使用* {padding: 0 margin: 0} - 这样您就可以稍后设置填充和边距，并且跨浏览器时具有信心。 - Jarrod Nettles

2

请注意，IE浏览器中的图例左侧有7像素的偏移 :)

您可以通过为图例设置边距来轻松解决此问题

margin: 0 -7px;

- Sander

谢谢你的提示！我会记住的。 - MisterXero

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jarrod Nettles · Accepted Answer

如果你没有具体指明是哪个IE版本，你需要知道每个浏览器都有自己的默认样式属性。当设计师没有显式地指定样式时，这些属性就会被应用。

这个问题的一个好的解决方法是使用CSS重置，它将每个元素的样式基本上归零。

http://meyerweb.com/eric/tools/css/reset/