internet-explorer - IE中<sub>或<sup>及其子代的相对字体大小

标签 internet-explorer font-size sup

尝试“Eric Meyer Reset”时,我偶然发现了一个有关font-size:100%声明的问题,该声明用于重置所有合适元素的字体大小。 font-size:100%表示元素应继承其父级的font-size属性,但IEt中的<sub><sup>元素及其后代(在6,7,8和9th版本中进行测试)不是这种情况。

例如(或this live example on a playground):

// CSS:
sup,span {font-size:100%;}
// HTML:
if you try this in IE, <sup>this text will be smaller <span>and this even more</span></sup>

IE似乎是另一个实现技巧,IE在Web设计人员上扮演这些元素的since this is not the only glitch。我的猜测是IE在<sub><sup>元素上应用了自己的硬连线样式,这使得它们的内容除了具有下标/上标功能之外还更小,但我无法找到一种方法来重置此行为(如果有的话) 。

//请直接回答此问题,“使用UA特定样式表”之类的建议可能会满足您的帮助感,但不满足您的要求:-) ..EDIT:好的,这种恳求最终使我反感,但我想在此至少说明一个关于此主题的答案。

编辑:看起来IE(直到IE9都是所有版本)将<sub><sup>及其子代的字体大小乘以一些可变系数(根据字体大小,在 0.6-0.8 之间)。

原因如下:当在font-size:15px标签及其所有后代上设置了固定大小(例如<sup>)时,它们的字体大小都在10px左右(≅ 0.7 ×15px)。但是,当设置相对大小(例如font-size:100%)时,系数效果从<sup>元素传播到其后代–因此,第一级后代的字体大小约为70%(≅ 0.7 ×的100%其<sup>父级),第二级后代的字体大小约为50%(≅ 0.7 × 0.7 ×<sup>祖先的100%),依此类推。当使用font-size:inherit时,这种传播会中断,因为这意味着该元素应该与它的父元素具有完全相同的大小–这适用于<sup>元素的后代,但IE仍然给<sup>元素本身提供比其父元素更小的字体大小元素确实有。

可以在this example上看到参与IE的系数理论:-)。还要将其与任何“符合标准的”浏览器进行比较。

最佳答案

到目前为止,似乎唯一的“解决方案”是在样式表中保留font-size:100% reset-declaration,并且仍然具有可接受的子/上标:

  • 使用其他元素来设置子/上标的样式,例如<span>。从语义上讲绝对不是一个好主意→被淘汰。
  • 使用特定于UserAgent的样式表,最好使用条件注释(这是我所担心的,因为到目前为止,对于IE≥7,我还没有使用它们),并明确地重新设置每个后代的样式以补偿“系数效应” →不值得:-)。
  • 保持原状,以便每个人都可以看到IE有其自己的规则(理想情况/天真,这可能迫使他们在下一版本中对其进行修复),并使用font-size:inherit至少使<sub><sup>的后代在默认情况下具有相同的大小在IE≥8中被接受。


  • 解决方案#2 ,这可以解决问题(确保可以对其进行调整,但仅是概念上的调整):
    <!--[if IE]>
    <style>
      sup *,sub * {font-size:120%; font-size:inherit;}
    </style>
    <![endif]-->
    

    如果您不追求最​​高性能(请参阅 * selector performance issue)。

    关于internet-explorer - IE中<sub>或<sup>及其子代的相对字体大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6804383/

    相关文章:

    android - 如何将中继服务器集成到正在运行的 SUP Android 项目中?

    javascript - 将用户输入从 azerty 键盘键自动转换为 javascript 中的阿拉伯字符

    javascript - IE 浏览器中的阴影(css3 htc 文件)

    html - CSS:IE 的轮廓偏移替代方案?

    javascript - 如何知道 javascript 函数被调用了?

    javascript - 使等宽文本尽可能大而不会导致溢出或换行

    css - Safari iPhone 返回时有时会增加字体大小

    ios - Sybase SUPQuery 测试标准问题 [iOS]

    objective-c - UILabel字体大小?