1

我在 iframe 中加载 HTML 页面并尝试将字体大小设置为 27pt 到 iframe 的正文。但它不会将该字体应用于所有元素。

下面是 DIV 和它的 CSS:

<div id="d10" class="fnt12 page2parttext">COLLECTION</div>

.fnt12 {
  font-size: 25px;
  font-family: MyriadPro-SemiExt;
  color: white;
}

我将这个 CSS 应用到页面的主体:

font-size: 40pt !important;

虽然在开发者工具中,font-size 属性.fnt12是删除线,但文本大小仍然是 25px 大小。我试图取消选中font-size: 25pxChrome Inpector 中的复选框并且它有效。

有什么问题?为什么它不会覆盖现有的 CSS 属性?

4

2 回答 2

3

这不起作用,因为您正在将规则应用于body元素。虽然您的字体设置将继承,但如果您将字体设置直接应用于子元素,通常会覆盖应用于父元素的字体设置。虽然该!important声明确实会优先考虑它在正文中应用的样式,但重要性不会下降到子级。这是一件好事,因为!important通常只用于对特定元素或元素集合进行微调。

有关特异性的官方规范,请参见http://www.w3.org/TR/CSS21/cascade.html

这是关于该主题的一般文章:http: //coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

于 2012-12-13T07:49:01.883 回答
2

您可以使用

* {
   font-size:25px;
}

在正文中设置它是行不通的,因为字体大小通常不是可继承的属性*。(字体颜色和字体系列是)。但是您可以将 div 和其他内容设置为:

div {
   font-size:inherit;
}

然后它将从其直接父级获取字体大小。

*措辞不好,请参阅此处了解更多信息:http ://webdesign.about.com/od/advancedcss/a/aa073007.htm

于 2012-12-13T07:40:03.083 回答