YUI重置CSS使其不起作用
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"规则使其恢复正常。我该如何解决?
解决方案
回答
如果强烈声明在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>
回答
只要样式在重设样式之后加载,它们就应该起作用。这是什么浏览器?因为我自己也以类似的方式工作,但我还没有遇到这个问题,所以我想知道这是否是我测试中的错误。
回答
我将使用此规则来覆盖YUI重置:
strong, b, strong *, b * { font-weight: bold; } em, i, em *, i * { font-style: italic; }
回答
如果除了使用YUI reset.css之外,还使用YUI base.css,则将全部设置为一组标准的跨浏览器基本样式。
链接:http://developer.yahoo.com/yui/base/
回答
当我将YUI重置添加到库存CSS文件的顶部时,我遇到了类似的问题。我发现对我来说最好的方法是简单地删除所有
font-weight: normal;
YUI Reset中的声明。我还没有注意到这影响了任何"跨浏览器"。
我所有的声明都是在YUI重设之后进行的,所以我不确定为什么它们没有生效。
回答
重置样式表最好用作基础。如果我们不想重置em或者strong,请从样式表中将其删除。
回答
就像Chris所说的那样,我们不必认真地使用它们提供的确切CSS。我只是将副本保存到服务器,然后根据需要进行编辑。
回答
我以为我有一个理想的解决方案:
strong, b { font-weight: bold; font-style: inherit; } em, i { font-style: italic; font-weight: inherit; }
不幸的是,Internet Explorer不支持"继承"。 :-(
回答
我建议避免使用任何涉及对YUI文件进行黑客攻击的方法。我们将来需要能够更新外部库,并且如果站点依赖于已编辑的版本,则很有可能会出现问题。我认为这对于我们使用的任何第三方库都是普遍的良好做法。
所以我认为这个答案是更好的答案之一
If in addition to using YUI reset.css, you also use YUI base.css, then you will be all set with a standard set of cross browser base styles.
回答
我明白你在说什么。我想我们可以添加这样的CSS规则:
strong em { font-weight: bold; }
或者:
strong * { font-weight: bold; }