YUI 重置 CSS 使 这不起作用答案

【问题标题】：YUI Reset CSS Makes this not workYUI 重置 CSS 使 这不起作用
【发布时间】：2008-08-21 14:36:41
【问题描述】：

YUI 的Reset CSS 中的这一行给我带来了麻烦：

address,caption,cite,code,dfn,em,strong,th,var {
    font-style: normal;
    font-weight: normal;
}

它使我的em 不是斜体，我的strong 不是粗体。没关系。我知道如何在我自己的样式表中覆盖它。

strong, b 
{
  font-weight: bold;
}

em, i 
{
  font-style: italic;
}

当我有em 和strong 的文本时，问题就出现了。

<strong>This is bold, <em>and this is italic, but not bold</em></strong>

我对@987654329@ 的规则使它变得粗体，但是YUI 对em 的规则使它再次变得正常。我该如何解决？

【问题讨论】：

标签： css yui

【解决方案1】：

如果你的强声明出现在 YUI 之后，你应该覆盖它。你可以这样强制：

strong, b, strong *, b * { font-weight: bold; }
em, i, em *, i * { font-style: italic; }

如果您仍然支持 IE7，则需要添加 !important。

strong, b, strong *, b * { font-weight: bold !important; }
em, i, em *, i * { font-style: italic !important; }

这行得通 - 自己看看：

/*YUI styles*/
address,caption,cite,code,dfn,em,strong,th,var {
  font-style: normal;
  font-weight: normal;
}
/*End YUI styles =*/

strong, b, strong *, b * {
  font-weight: bold;
}

em, i, em *, i * {
  font-style: italic;
}

 &lt;strong&gt;Bold&lt;/strong&gt; - &lt;em&gt;Italic&lt;/em&gt; - &lt;strong&gt;Bold and &lt;em&gt;Italic&lt;/em&gt;&lt;/strong&gt;

【讨论】：

+1 因为这是正确答案。标记为正确的在 IE7 上不起作用
谢谢，斯科特。你是对的。 !important 在 IE7 中是必需的。

【解决方案2】：

我会使用这条规则来覆盖 YUI 重置：

strong, b, strong *, b *
{
  font-weight: bold;
}

em, i, em *, i *
{
  font-style: italic;
}

【讨论】：

【解决方案3】：

如果除了使用 YUI reset.css 之外，您还使用 YUI base.css，那么您将使用一套标准的跨浏览器基础样式。

链接：http://developer.yahoo.com/yui/base/

【讨论】：

YUI base 不能解决问题。它使粗体和斜体变得强烈，但当相同的文本包含在两个标签中时，不能解决冲突。

【解决方案4】：

当我将 YUI 重置添加到我的股票 CSS 文件的顶部时，我遇到了类似的问题。我发现对我来说最好的事情就是简单地删除所有

font-weight: normal;

来自 YUI 重置的声明。我没有注意到这会影响任何“跨浏览器”。

我所有的声明都是在 YUI 重置之后，所以我不确定为什么它们没有生效。

【讨论】：

【解决方案5】：

只要您的样式在重置样式之后加载，它们就应该可以工作。这是什么浏览器？因为我自己的工作方式类似，我没有遇到这个问题我想知道这是否是我的测试有问题。

【讨论】：

【解决方案6】：

重置样式表最好用作基础。如果您不想重置 em 或 strong，请将它们从样式表中删除。

【讨论】：

【解决方案7】：

正如 Chris 所说，您不必使用他们虔诚地提供的确切 CSS。我只是将副本保存到您的服务器，然后根据您的需要进行编辑。

【讨论】：

【解决方案8】：

我建议避免任何涉及破解 YUI 文件的事情。您需要能够在将来更新外部库，如果您的站点依赖于已编辑的版本，那么它很有可能会被篡改。我认为这对于您使用的任何 3rd 方库来说都是一般的良好做法。

所以我认为this 的答案是最好的答案之一

如果除了使用 YUI reset.css 之外，您还使用 YUI base.css，那么您将使用一套标准的跨浏览器基础样式。

【讨论】：

【解决方案9】：

我明白你在说什么。我想你可以添加这样的 CSS 规则：

strong em { font-weight: bold; }

或：

strong * { font-weight: bold; }

【讨论】：

【解决方案10】：

我认为我有一个理想的解决方案：

strong, b 
{
  font-weight: bold;
  font-style: inherit;
}

em, i 
{
  font-style: italic;
  font-weight: inherit;
}

很遗憾，Internet Explorer 不支持“继承”。 :-(

【讨论】：