<sub>或<sup>的相对字体大小及其在IE中的后代

Question

尝试" Eric Meyer重置 "我偶然发现了一个关于font-size:100%重置所有合适元素字体大小的声明的问题.font-size:100%意味着元件应该继承font-size父的属性,但是这是不符合的情况下 <sub>和<sup>元素和它们的后代在IE(在6,7,8和第九版测试).

例如(或在操场上的这个实例):

// 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在webdesigners上播放,因为这不是这些元素的唯一故障.我的猜测是IE在<sub>和<sup>元素上应用了一些自己的硬连线样式,除了上/下标之外,它们使内容更小,但我找不到重置此行为的方法,如果有的话.

//请直接回复此问题,像"使用UA特定样式表"这样的建议可能会满足您的帮助,但不满足主题:-) ..EDIT:好的,这个请求最终反对我,但是我想在这里说出至少一个对这个主题的答案.

编辑:它看起来像IE(所有版本直到IE9)相乘的字体大小<sub>和<sup>以及它们与(之间某物一些可变系数的后代0.6 - 0.8根据字体尺寸).

其理由是以下:当一个固定大小(例如font-size:15px)设置在<sup>标签及其所有后代,它们都具有围绕10px的字体大小(≅ 0.7 ×15像素).但是,当正在设定的相对大小,而不是(例如font-size:100%),将系数效应从传播<sup>元件下降到其后代-所以第一级后代具有大约70%(≅字体大小0.7其的×100%<sup>母体),第二级后代具有的字体大小在50%左右(≅ 0.7 × 0.7其的数×100%<sup>祖先)等.这种传播在font-size:inherit使用时会中断,因为它意味着元素应该与其父元素具有完全相同的大小 - 这适用于<sup>元素的后代,但是<sup>元素本身仍然被IE给出比其父元素更小的字体大小.

在这个例子中可以看到参与IE的系数理论:-) .还要将其与任何"标准兼容"浏览器进行比较.

Answer 1

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

\n\n

\n
• 使用不同的元素来设置子/上标的样式，例如<span>。根据语义 \xe2\x86\x92消除绝对不是一个好主意。
\n
• 使用特定于 UserAgent 的样式表，最好使用条件注释（这是我担心的，因为直到现在我还没有必要将它们用于 IE \xe2\x89\xa5 7）并明确地重新设计每个后代的样式以进行补偿“系数效应”\xe2\x86\x92它不值得:-)。
\n
• 保持原样，这样每个人都可以看到 IE 有自己的规则（理想/天真地这可能会迫使他们在下一个版本中修复它）并使用font-size:inherit至少具有 IE \xe2 的后代<sub>或<sup>默认大小相同\x89\xa5 8 \xe2\x86\x92已接受。
\n

\n\n\n\n

解决方案#2，这可以解决问题（当然可以调整，但只是概念）：

\n\n

<!--[if IE]>\n<style>\n  sup *,sub * {font-size:120%; font-size:inherit;}\n</style>\n<![endif]-->\n

\n\n

前提是您不追求最​​高性能（请参阅*选择器性能问题）。

\n