Google如何实现这种字体厚度？

Question

我一直在尝试使用谷歌在其菜单上使用的相同字体，但似乎无法复制已达到的厚度。

至于我能看到的字体细节如下：

color: #FFF; 
font-family: 'Open Sans'; 
font-weight: 400; 
font-size: 16px; 

我已经使用了相同的风格，但不能为我的生命弄清楚他们如何设法“勾芡”的字体所以它不会在黑暗的背景中迷路。

我试过字体重量600，这太厚了。

下面是一张照片作为例子。

有没有可能是他们已经改变了“打开三世”的字体，他们免费提供？

Answer 1

我看不出太大的区别自己，但你可以增加一点用最少的文字阴影其重量：text-shadow: 0 0 ;

---

此外，检查出至极真的使用https://www.google.com/fonts#QuickUsePlace:quickUse

<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>

或

<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

---

div, 
 
p { 
 
    color: #FFF; 
 
    font-family: 'Open Sans'; 
 
    font-weight: 400; 
 
    font-size: 16px; 
 
    background: #4386FC; 
 
    padding: 1em; 
 
    margin: 1em; 
 
} 
 
p { 
 
    background: #AB0909 
 
} 
 
th:first-child, 
 
td:first-child { 
 
    text-shadow: 0 0; 
 
} 
 
caption { 
 
    font-size: 1.5em; 
 
} 
 
table { 
 
    background: linear-gradient(to left, rgba(0, 0, 0, 0.2)50%, rgba(0, 0, 0, 0.1)50%), linear-gradient(to bottom, transparent 2em, #AB0909 2em, #AB0909 57%, #4386FC 57%); 
 
} 
 
table:hover { 
 
    background: linear-gradient(to right, rgba(0, 0, 0, 0.2)50%, rgba(0, 0, 0, 0.1)50%), linear-gradient(to bottom, transparent 2em, #AB0909 2em, #AB0909 57%, #4386FC 57%); 
 
}

<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'> 
 
<table> 
 
    <caption>be text-shadowed or not</caption> 
 
    <thead> 
 
    <tr> 
 
     <th>text-shadow:0 0</th> 
 
     <th>no text-shadow</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td> 
 
     <div>test font</div> 
 
     <p>test font</p> 
 
     </td> 
 
     <td> 
 
     <div>test font</div> 
 
     <p>test font</p> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 2

http://www.elfboy.com/blog/text-shadow_anti-aliasing/

必须字体平滑属性添加到您的文本元素。通常访问者使用不同的浏览器或具有自己渲染技术的设备查看您的网页，是否在样式表中包含媒体查询？