什么是跨瀏覽器，跨平台的網絡安全字體？

Question

如何使跨瀏覽器，跨平台和所有設備兼容的css字體堆棧？

Answer 1

您不能保證將在移動設備上使用的字體與保證普通計算機上可用的字體相同。

一個安全的選擇是使用可以由移動瀏覽器解釋的通用字體系列來向您顯示相關字體，例如

font-family: serif; /* (e.g., Times) */
font-family: sans-serif; /* (e.g., Helvetica) */
font-family: monospace; /* (e.g., Courier) */

Answer 2

最好的解決方案是在任何特定字體之后始終提供通用字體系列 ：

font-family: "Foo Regular", "Bar Sans", sans-serif;

Answer 3

也許這個鏈接可以給你一些更多的想法：

http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html

使用上面的字體系列從未給我帶來任何問題。

Answer 4

也許這可以幫助您完成任務： 與Mac和Windows操作系統，Microsoft Office和Adobe Creative Suite捆綁在一起的字體矩陣

Answer 5

它在W3C建議書的15.3中指出了'font-family'屬性，你應該在字體堆棧中有后備字體，以便你的網站訪問者有一些可行的選擇。

我使用的'web safe'字體堆棧，涵蓋了大多數（如果不是全部）設備，如下所示：

/* Web Safe Font Stacks (classes set in CSS) */
.head {font-family: Georgia,'Times New Roman',serif}
.para {font-family: Verdana,Arial,sans-serif}
.mono {font-family:'Courier New',Courier,monospace}
.fant {font-family: Papyrus,Impact,fantasy}
.curs {font-family:'Apple Chancery','Lucida Calligraphy',cursive}

這包括標題，段落，代碼樣本的等寬，特殊項目的幻想和強調草書。 您可能只需要一個用於標題（H1~H6）而另一個用於正文：

body {font-family: Verdana,Arial,sans-serif}
h1, h2, h3, h4, h5, h6 {font-family: Georgia,'Times New Roman',serif}

查看2010年包含Linux和iOS的以下備忘單。 它給出了Windows，Mac，Linux和iOS之間平均使用百分比： Web安全字體

Answer 6

忘掉跨瀏覽器的跨平台字體堆棧，Web示例通常只關心Windows和OSX的基本拉丁語，它們在國際語言和Linux上失敗，以及新的外形。

出於許可的原因，Linux從未使用過與Windows和OSX相同的字體，字體設計工具已經變得足夠成熟，你現在發現了很多不同的東西（並不是說創建一個大的編碼字體很容易，但很多用戶只關心那些字體涵蓋他們的特定語言）。

字體創建已經變得足夠便宜大公司（包括移動制造商）現在喜歡通過為大版本（新設備或主要操作系統版本）調試新字體來區分。

當字體調查仍然很受歡迎時，DejaVu字體系列在Linux上有很多功能，可能不再是這種情況了。 DejaVu和Arial有不同的指標。

只需在堆棧中使用通用的CSS字體系列，避免使用任何helvetica衍生產品，不要使用依賴於特定字體指標的設計，您就可以了。

Answer 7

Google頂部的一些“Web安全字體”鏈接：

https://www.cssfontstack.com/

http://web.mit.edu/jmorzins/www/fonts.html