在Chrome浏览器与Firefox，IE浏览器和Safari浏览器中，相同的字体看起来不同

该问题与不同浏览器中的渲染字体有关。我很惊讶地发现这个问题只在Chrome中被复制。它在Firefox，IE8，Safari甚至IE6都能正常工作。在Chrome浏览器与Firefox，IE浏览器和Safari浏览器中，相同的字体看起来不同

下面是示例。

enter image description here

这里来的代码本身：

<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重置，并尝试过它。任何奇迹都没有改变。另一种我被认为是使用的方式是固定容器标签的宽度。但由于需要维护多个本地化，我不能使用这种方法。

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

等待您的意见。提前致谢。

来源

2013-01-18 godspeed

这里有什么问题？这只是一个关于Chrome的事实，它在Windows上的字体渲染并不是那么棒。 – Marcin

问题是，如果在css或其他地方有任何魔法来解决问题而不创建特定于Chrome的样式。 – godspeed

@godspeed据我所知，没有没有。每个浏览器都以自己的方式呈现字体。您可以通过javascript为Chrome浏览器设置字体，但不知道是否有更多选项... –

文本渲染确实不同于浏览器到浏览器。有时无论我们试图改变渲染的程度，我们都不会得到它。如果你愿意，你可以阅读this文章。它没有提供解决方案（我认为没有解决方案），但它强调了这种差异。

来源

2013-01-18 14:50:55 Srinivas

> Srinivas感谢您的链接。那里没有Chrome。我明白，可能没有解决办法。我读到Safari和Chrome使用相同的渲染引擎。这让我觉得Chrome有解决这个问题的魔力。 – godspeed

在Chrome浏览器与Firefox，IE浏览器和Safari浏览器中，相同的字体看起来不同

回答

相关问题