最近，每個人似乎都在談論龍蝦。不是海洋的甲殼類動物，而是網絡字體。對於那些尚未聽說過的人，龍蝦是一個流行的Google字體的一個很好的例子，該字體嵌入了網頁中。
嵌入字體並不像您想像的那麼新。早在1998年，CSS 2引入了 @font-face規則。從理論上講，這使設計人員能夠將任何truetype或postscript字體下載到用戶計算機中以在網頁中顯示。不幸的是，當時，只有Internet Explorer 4支持該規則。人們普遍擔心許可昂貴的字體會被盜用。如今，CSS 3仍然無濟於事，但所有網絡瀏覽器都支持該規則。從那時起，屏幕分辨率也得到了巨大改進。因此，如果您還沒有接受字體嵌入，那麼現在是時候這樣做了。>
鑰匙要點>這些差異中的許多差異之所以發生，是因為原始的Apple Mac操作系統與每英寸72的舊印刷技術相關。因此，在顯示屏上分配了10點字體10個像素。當時，Apple提供的垂直（肖像）監視器與標準紙的大小相同，並且可以從屏幕上進行直接的一對一比較與印刷版本進行比較。另一方面，微軟選擇了96ppi的基礎，人們將距離計算機監視器的距離額外1/3，而不是從印刷頁面上。因此，所有內容在基於Windows的計算機上都渲染了1/3。 自1990年代這些技術出現以來，事情已經走了很長一段路，現在我們有無數不同的屏幕尺寸和解決方案可以處理。但是，除非您指定字體，否則用戶的設備和瀏覽器仍將為您選擇字體。 >
>另一個問題是某些組織限制了用戶計算機上的字體。我曾經在一個僅安裝了佐治亞州和威爾達納的計算機的組織工作。這樣一來，員工發送的信件和電子郵件只能使用與公司身份相匹配的字體發送。充分利用內置字體
>儘管沒有使用公司字體，大多數台式機和筆記本計算機 - 都為Web項目的Microsoft Core Fonts創建了字體。 1996年的這件字體包括Andale Mono，Arial，Arial Black，Comic Sans MS，Courier New，Georgia，Impact，Times New Roman，Trebuchet MS，Verdana和Webdings。雖然，這些字體或它們的等效物的版本可以依賴於大多數台式機和筆記本電腦上，但瀏覽器可能不會按照您的預期顯示字體。
來最大程度地限制此類限制。這為瀏覽器設置了CSS規則，以使用許多字體之一。它始終包括一個捕獲所有襯線（在中風的末端帶有小點綴）或sans-serif（沒有點綴）。因此，我們可能擁有字體家庭：Cambria，“ Hoefler Text”，“ Liberation Serif”，Times，“ Times New Roman”，Serif。瀏覽器應瀏覽您的“堆棧”，並使用用戶計算機上存在的第一個定義字體顯示文本。如果找不到任何一個，它使用的後備字體在此示例中定義為serif。
的目的是選擇一系列字體，這些字體在各種不同的分辨率和變焦級別的範圍內都很好地渲染。 >在這裡對加拿大設計師Amrinder Sandhu的字體堆棧進行了很好的討論。 不幸的是，如果您的觀眾正在使用手持設備，則使用字體堆棧無濟於事。 Android設備使用Droid Sans，Droid Serif和Droid Sans Mono，而Apple iOS設備使用具有各種樣式和重量的Helvetica Neue。
>您可能希望與依賴多種操作系統和版本的內置字體相比，對WordPress頁面的外觀有更多的控制權。我們可以通過嵌入字體來克服這一點。
>現在，讓我們看一下可用的Web字體的類型。
>>絕大多數可用字體都以某種方式獲得許可。當您購買已安裝操作系統的計算機，平板電腦或手機時，部分費用是字體的許可。但是，有多種使用多種自由嵌入字體的方法。
>該平台可能是最受歡迎的免費字體服務，可能是最受歡迎的免費字體服務，提供了700多個設計良好的字體，包括龍蝦。
>付費字體
儘管自由字體流行，但仍然有大量的字體鑄造廠提供高級字體。例如，類型的Foundries檔案列表列出了近300個創建者和提供優質字體的網站，儘管並非所有這些都可以嵌入網頁中。> 在提供用於網絡使用的高級字體的組織中，德國字體商店也許是付費字體最受歡迎的市場。有高質量的字體，以及異常的字形，例如Ulrike Rausch的廚房水果和蔬菜，叉子和刀，鍋和家用電器，Liebecook。
如果您有一個Adobe Creative Cloud帳戶，則自動可以訪問Adobe的Typekit服務。 Typekit提供450多個字體。注意到的是，雖然許可證允許您在打印出版物和個人非商業網站中使用字體，但如果您為客戶端工作，則只有在擁有Adobe Business帳戶時才可以使用Web字體。 Adobe建議您在開發過程中為客戶設置帳戶，並將其交給他們。這是一個缺點，如果客戶端未能支付其帳戶，則該站點將恢復為您已定義的字體堆棧中的後備字體，即係統字體。
在WordPress頁面和帖子中獲取想要的字體>
實際代碼因服務而異。我將概述Google字體的方法以及Adobe Edge/Typekit。其他服務以類似的方式工作。不過，首先，請記住備份您的網站（或理想地使用單獨的開發副本），並在文件的副本上工作，以防萬一出現問題。應使用兒童主題進行樣式更改，以便每次更新主題時都不會覆蓋您的更改。Google字體
選擇字體後，單擊“快速使用”按鈕。如果提供，請檢查所需的權重和样式，以及字符集（S）。
第二種方法同樣簡單，它使用鏈接方法，並且代碼包含在標準選項卡上。這次，代碼放在header.php文件中。將代碼放在文件頂部。然後，您可以將字體的名稱添加到字體堆棧中。請記住將其添加為第一個字體，其次是首選系統字體和後備字體樣式。
>在這裡值得注意的是，Google Web Fonts博客指出，如果在 @font-face聲明之前存在腳本標籤，那麼Internet Explorer將在FONT文件完成下載之前不會顯示任何頁面內容。因此，如果文件無法下載，則可能留下空白或部分加載頁面的Internet Explorer用戶。因此，請儘早將 @font-face聲明放在文件中。
>另一種方法是enqeue
>
> Adobe Edge Web字體和Typekit
在WordPress中添加Adobe Typekit字體>使用Typekit，通過Creative Cloud應用程序登錄到您的帳戶。選擇字體後，創建一個套件。給您的套件一個名稱，然後添加您使用該字體的網站的域名。輸入網站詳細信息後，您將獲得一塊JavaScript。使用純文本編輯器（例如Textedit或Notepad）複製並將其保存在文本文件中。
>
>下一步是選擇您的字體，將其添加到網站套件中，然後發布。添加您希望使用並發布的任何其他字體。 
>
發布套件後，請轉到WordPress插件的Typekit字體。
>添加您保存在文本文件中的代碼。
>
>根據需要添加CSS代碼選擇器。在示例中，我添加了後標題顯示為H1文本（WordPress頁面和帖子標題是H1文本。）。我還添加了主體文本中的H2子標題的子標題。請注意，在命名選擇器之前，最好檢查名稱是否已在主題中使用。您可以使用瀏覽器中的開發人員工具檢查元素來做到這一點。不要忘記刷新您的屏幕按照您進行的每次更改，可能需要幾分鐘才能在您的網站上使用該字體。
>
>最後，還建議您每次使用字體時始終指定字體重量和字體式屬性。同樣，這有助於您控制多種可能的平台上字體顯示的控制。
>Google在Pop Out中提供了一個字體配對功能，該按鈕位於“快速使用”按鈕旁邊，以幫助您開始。圖形設計是一種需要數年掌握的工藝，但是嵌入幾個好的字體將確保您選擇的所有用戶都可以看到您選擇的設計。
>經常詢問有關在WordPress中使用Web字體的問題
>如何將Google字體添加到我的WordPress站點？>您可以使用CSS更改WordPress中的字體大小。轉到外觀>自定義> WordPress儀表板中的其他CSS，然後添加CSS規則以更改字體大小。例如，要將所有段落的字體大小更改為16px，您可以使用以下CSS：p {font-size：16px; 。 。網絡安全字體的示例包括Arial，Times New Roman和Courier New。 ，您可以簡單地引用CSS中的字體。例如，為了將Arial字體用於所有段落，您可以使用以下CSS：P {font-fot-family：arial; 。例子包括時代新羅馬和佐治亞州。另一方面，sans-serif字體沒有這些小線條。示例包括Arial和Helvetica。
在WordPress中使用serif字體，您可以在CSS中引用字體。例如，要使用佐治亞州的字體用於所有標題，您可以使用以下CSS：H1，H2，H3，H4，H4，H5，H6 {Font-Font-family：Georgia; 。您可以通過使用CSS將不同的字體應用於不同的HTML元素來做到這一點。例如，您可以使用一條字體進行標題，而另一個字體用於正文文本。
以上是如何在WordPress中使用Web字體的詳細內容。更多資訊請關注PHP中文網其他相關文章！
