css - YUI 重置 CSS 使这不起作用

Question

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>

我对 strong 的规则让它变成粗体，但是 YUI 对 em 的规则让它再次正常。我该如何解决？

Answer 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;
}

 <strong>Bold</strong> - <em>Italic</em> - <strong>Bold and <em>Italic</em></strong>