css怎么設置字體平滑

這篇文章主要介紹css怎么設置字體平滑，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

css的全稱是什么

css的全稱是Cascading Style Sheets（層疊樣式表），它是一種用來表現HTML或XML等文件樣式的計算機語言。CSS不僅可以靜態地修飾網頁，還可以配合各種腳本語言動態地對網頁各元素進行格式化。

在css中，可以使用“-webkit-font-smoothing”屬性來設置字體平滑，語法“-webkit-font-smoothing: subpixel-antialiased”；該屬性可以使頁面上的字體抗鋸齒,看起來會更清晰舒服。

本教程操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

在圍觀Drupal官方主題的時候，發現了一個有意思的非標準CSS選擇器-webkit-font-smoothing，于是上手把玩了一番。如何使用css3字體平滑顯示呢

要知道，W3C對CSS中字體的抗鋸齒渲染是有過考慮的，如font-smooth，不過可能由于不同操作系統以及瀏覽器內核對字體的渲染存在差異，總之，他并沒有被選入Web標準。但是WebKit還是保留了一套自有的非標準選擇器來實現對抗鋸齒效果的支持，來讓字體顯示的更加平滑。

-webkit-font-smoothing主要有一下三個屬性：

• none: 無抗鋸齒

• subpixel-antialiased (default): 次像素平滑 常見于Mac OS和MacType For Windows

• antialiased: 灰度平滑 常用于Android和iOS等移動設備的

不過經過嘗試，我的木頭眼睛完全分辨不出后兩個的區別。 而且這個非標準的CSS只適用于大多數的手機瀏覽器及Safari和Chrome之類的WebKit內核的桌面瀏覽器。至于IE系列嘛，你自己不支持，怪我咯~

這里看看實際效果吧，首先是沒有采用抗鋸齒渲染的：

接下來是采用-webkit-font-smoothing: subpixel-antialiased抗鋸齒渲染平滑處理后的效果：

可以看出來，字體邊緣的光滑程度還是不一樣的，加上后確實好看了不少。

經過測試發現，瀏覽器的內置基礎屬性中一般已經包含了字體抗鋸齒。但是為了保險起見，還是手動加上一個吧~

以上是“css怎么設置字體平滑”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！