5x8小时服务热线:131 4102 7650(同微信)
您当前的位置:首页 > 网站常识 - SEO优化

如何正确使用CSS3字体平滑

来源:北京网站建设 标签:css3平滑字体
分享到:

I've came across some people usually wondering how some websites have such crisp and clear font. There are two reasons for this:
我遇到过一些人,通常想知道一些网站有这样的清晰和清晰的字体。这有两点原因:

1. They are most likely using the -webkit-font-smoothing hack. This type of hack is mostly used for mobile browsers, as well as the Apple Safari and Google Chrome Browsers.
1。他们是最有可能使用的WebKit的字体平滑的黑客。这类黑客主要用于移动浏览器,以及苹果的Safari浏览器和谷歌浏览器。

2. To really smooth the font and not have anything too blurry websites usually use the text-shadow effect. This is also used so the font will look smooth on all browsers (Opera, Firefox, Safari, Chrome and others alike) except internet explorer.
2。要真正流畅的字体并没有任何太过模糊的网站通常使用的文字阴影效果。这是我使用的字体看起来会光滑在所有浏览器(Opera,Firefox,Safari,Chrome和其他人一样)除了Internet Explorer。

When you apply the font smoothing hack to your stylesheet and you want it applied to your whole site, make sure we write the following code.
当你将字体平滑黑客你的样式表和你要应用到你的整个网站,确保我们写下面的代码。

Lets start off by adding the font smoothing hack to your stylesheet:
html, html a {
    -webkit-font-smoothing: antialiased !important;
}
Now for the text shadow effect to really smooth out the font:
html, html a {
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}
Here is the code all put together:
html, html a {
    -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}

To really see what I am talking about, here are a couple of demo's that shows it's smoothing.

If you have a good eye for this kind of design, you will notice the difference:
 

Here is how it looks when the font is not smoothed:

Hello World!

Here is how it looks when the font is smoothed:

Hello World!

备注:本篇文章由加网编辑原创内容,转载请注明出处:转自加网

相关网站常识

更多