8種機械鍵盤軸體對比

本人程序員，要買一個寫代碼的鍵盤，請問紅軸和茶軸怎么選？

0、問題來源

在移動hybrid開發，也就是說，部分頁面會使用html+css+javascript技術來制作，例如個人中心，收藏頁面等。一般來說，移動端都會將字體設置為system系統默認類型。起初，愚鈍的我認為，只要在css里不設置任何字體，將會默認使用系統默認字體。然而結果并未如我所想，頁面出來后，中文、英文和數字幾乎是3種不同的字體，而且沒有一類是和移動端的字體相同。

1、瀏覽器默認字體

基于上述的問題，我google了一下iOS和Android的默認字體。找到了一篇大概如下：

1.1、iOS系統(感覺很正確)默認中文字體是Heiti SC

默認英文字體是Helvetica

默認數字字體是HelveticaNeue

無微軟雅黑字體

1.2、Android系統默認中文字體是Droidsansfallback

默認英文和數字字體是Droid Sans

無微軟雅黑字體

然后，我將上面的字體對應系統地測試了一遍，結果，也沒有一款字體是和原生頁面中的字體相同。

那么在此時，我突然覺得有個問題maybe理解錯了，就是webview的默認字體和app級別的默認字體是同一回事么？從上面的測試，我覺得應該是不同的(當然也有可能是我找到的字體其實也是錯的)。但就算是相同，每個系統的字體也不一定都一樣，特別是android，各種字體亂來，如果按照不同的系統來配置字體，簡直會讓人瘋掉。

然后我再去google…

2、css設置system默認字體: -apple-system

最終，我找到了-apple-system，一個AppleWebkit里獨有的屬性。On iOS 9 and OS X 10.11, doing this allows you to use Apple’s new system font, San Francisco(打臉). On platforms which do not support -apple-system, the browser will simply fall back to the next item in the font-family fallback list.

簡單地設置一下1

2

3body{

font-family: -apple-system;

}

完美！！字體完全一致。

雖然這個屬性不兼容低版本的iOS系統，也不是規范(AppleWebkit的私有屬性)，但是真的很cool。更巧的是，crosswalk也是基于AppleWebkit，所以如果你的原生app集成了crosswalk，那恭喜你，這方法完全能用。更更巧的是，咱們的Android就集成了crosswalk(這其實很正常)，所以安卓的也算是解決了。

那低版本的iOS7，8怎樣解決呢？1

2

3body{

font-family: -apple-system, "Helvetica";

}

完美！

總結

以上是生活随笔為你收集整理的iOS和android h5字体差异,关于移动hybrid开发中H5页面的字体应与系统保持一致的问题...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。