相同的字体在 Chrome 与 Firefox、IE 和 Safari 中看起来不同

2024-03-06

该问题与在不同浏览器中呈现字体有关。我很惊讶地发现这个问题只在 Chrome 中重现。它在 Firefox、IE8、Safari 甚至 IE6 中运行良好。

样品来了。

这是代码本身:

<div style="position:absolute;bottom:2px;padding-top: 1px;width:100%;">
   <span style="float:left;">
      <div id="saveCustomizationButton" class="smallBlueButton">
         <span>Speichern</span>
      </div>
   </span>
   <span style="float:right;padding-right:1px;">
      <div id="downloadOrPrintButton" class="smallGreenButton smallGreenButtonSmallLetterSpace">
         <span>Downloaden oder drucken</span>
      </div>
   </span>
</div>

div.smallGreenButton span, div.smallGreenButton a {
    display: block;
    line-height: 14px;
    padding: 1px 7px 2px 13px;
}
div.smallGreenButton {
    font-family: arial,sans-serif;
    font-size: 12px;
    font-weight: 600;
}
div.smallBlueButton {
    font-family: arial,sans-serif;
    font-size: 12px;
    font-weight: 600;
}

这就对了。我读过有关 css Reset 的内容,并尝试过。任何奇迹——什么都没有改变。我考虑使用的另一种方法是固定容器标签的宽度。但由于需要维护多个本地化,我无法使用这种方法。

希望smb能提出解决方案。或者我需要实现一些特定于浏览器的行为。

静候你的评价。提前致谢。


文字渲染不同浏览器确实有所不同有时,无论我们如何尝试改变渲染,我们都不会得到它。你可以阅读this http://css-tricks.com/font-rendering-differences-firefox-vs-ie-vs-safari/文章,如果你愿意的话。它没有为这个问题提供解决方案(我认为没有),但它强调了差异。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

相同的字体在 Chrome 与 Firefox、IE 和 Safari 中看起来不同 的相关文章