我們如何可靠地偵測網頁上實際呈現的字體？

偵測網頁中的特定字體

確定網頁上呈現哪種字體對於確保最佳使用者體驗至關重要。考慮一個定義多種字體的 CSS 規則：

body {
    font-family: Calibri, Trebuchet MS, Helvetica, sans-serif;
}

我們如何偵測這些字體中的哪一個實際顯示在使用者的瀏覽器上？

此確定的原因至關重要，因為特定字體可能包含其他地方沒有的獨特字形。因此，如果用戶缺少所需的字體，最好提供下載連結。然而，目前，下載連結會向所有使用者顯示，即使是那些安裝了正確字型的使用者。

一種巧妙但可能不可靠的方法涉及創建具有特定字體和文字的元素。如果瀏覽器缺少指定的字體，它將從其父元素繼承該字體。透過測量渲染文字的寬度並將其與所需字體和繼承字體的預期寬度進行比較，可以確定所需字體是否存在。但是，此技術不適用於等寬字體。

有關此主題的更多見解，請參閱以下參考資料：

• Javascript/CSS 字體偵測器 （ajaxian.com；2007 年3 月12 日）

以上是我們如何可靠地偵測網頁上實際呈現的字體？的詳細內容。更多資訊請關注PHP中文網其他相關文章！