css google fonts cyrillic - 一些字母被切掉 [英] css google fonts cyrillic - some letters are cut off

问题描述

我在网站上使用google字体时遇到问题，
只有在使用字体大小时才出现问题，
一些字母较小或在顶部切掉。
在google fonts网站没有问题，虽然，如果我尝试在我的服务器上使用它，我看到了。

在屏幕截图，你可以看到字母П和Г越小，那么其他。

 
 
 
 
 < < link rel =stylesheethref =http://fonts.googleapis.com/css?family=Open+Sans:300,700&amp;subset=latin,cyrillic-ext,cyrillic media =screen> 
  

和：

 code>< span style ='font-family：Open Sans，sans-serif; font-size：16px; font-weight：300; font-style：normal;'>ПРОГРАММАглАнаяГа< / span> 
  

我已经在网上上传了简单的示例代码： http://tochka.cz/fontstest/

linux | osx没有问题，只有在所有Windows浏览器，
font-size：16px是一个问题，虽然font-size：17px不是。

非常感谢您的帮助。

解决方案

这是使用的字体的设计缺陷：它并没有设计为使用不同字体渲染技术在所有大小。这种问题出现在一些大小的谷歌字体（前面的例子我观察到的Sansation字体的17px大小），它们可能与Windows上的字体渲染具体相关。

我不认为有任何快速的解决方案。谷歌字体应该在不同的环境（特别是在Windows上）测试，如果一些字体和字体大小组合被证明有问题，只是避免 - 使用1px更小或更大的尺寸应该有所帮助。

更新：Google Web Fonts网站使用不同的字体文件，并且测试与以下（从网站的CSS提取），不会出现问题：

  @ font-face {
 font-family：'Open Sans'; 
 font-style：normal; 
 font-weight：300; 
 SRC：本地（开放三世光），本地（'OpenSans-光），
 URL（http://themes.googleusercontent.com/licensed/font?kit=DXI1ORHCpsQm3Vp6mXoaTb7uYOTH0fqwR2fK3MMTyiuruusgsetRaCmkKU2Of3BmMh8Htnga2sTO__4Bgy4aRUbOfyIL9KspCxN8ekvQQBzoq8GLqcC6GrPYOPNC3QDT）格式（ woff）; 
} 
  

恐怕这种方法不稳健。

I've got a problem with using google fonts on website, The problems shows only if even font-size is used, Some of the letters are smaller or cut off on the top. There is no problem on google fonts website, though, if i try to use it on my server, i see it.

On the screenshot, you can see that letters П and Г are smaller, then other. Line-height doesn't help.

Here is my code:

<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700&amp;subset=latin,cyrillic-ext,cyrillic" media="screen">

and:

<span style='font-family:"Open Sans", sans-serif; font-size:16px; font-weight:300; font-style:normal;'>ПРОГРАММА глАнаяГа</span>

I've uploaded simple sample code on the web: http://tochka.cz/fontstest/

No problems with linux|osx, but only on all windows browsers, font-size:16px is a problem, though font-size:17px isn't.

Thanks in advance, i really appreciate your help.

解决方案

This is a design flaw in the font used: it has not been designed to work with different font rendering techniques in all sizes. Such problems appear with some Google fonts in some sizes (the previous case I observed was the Sansation font in 17px size), and they may relate specifically to font rendering on Windows.

I don’t think there’s any quick solution. Google fonts should be tested in different environments (especially on Windows), and if some font face and font size combination turns out to be problematic, just avoid it—using 1px smaller or larger size should help. This emphasizes the need for testing with texts that cover a rich enough character repertoire (including capital letters).

Update: The Google Web Fonts site uses a different font file, and testing with the following (extracted from the CSS of the site), the problem does not appear:

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'),
  url(http://themes.googleusercontent.com/licensed/font?kit=DXI1ORHCpsQm3Vp6mXoaTb7uYOTH0fqwR2fK3MMTyiuruusgsetRaCmkKU2Of3BmMh8Htnga2sTO__4Bgy4aRUbOfyIL9KspCxN8ekvQQBzoq8GLqcC6GrPYOPNC3QDT) format('woff');
}

I’m afraid such an approach is not robust.

这篇关于css google fonts cyrillic - 一些字母被切掉的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！