瀏覽「轉譯」分頁選項，探索可套用到網頁的實用效果。
醒目顯示廣告頁框
如要查看頁框是否已標記為廣告，請按照下列步驟操作：
模擬已聚焦的網頁
如果您將焦點從頁面切換至開發人員工具，當焦點觸發某些重疊元素時，這些元素會自動隱藏。例如：下拉式選單、選單或日期挑選器。您可以使用 check_box「模擬聚焦網頁」選項來為這類元素偵錯，就像該元素位在焦點一樣。
如要模擬已聚焦的網頁：
- 開啟含有要偵錯元素的網頁，例如 YouTube 網站的搜尋列。
在網頁上開啟「算繪」分頁，然後檢查並清除「模擬已聚焦的網頁」。
你也可以在「元素」>動作列的「:hov」按鈕下方找到相同選項] >「樣式」。
停用本機字型
在 @font-face 規則中停用 local() 來源，確認本機字型替代方案是否正常運作。
開發人員和設計人員通常會在開發期間使用兩種同一字型的不同副本：
- 設計工具的本機字型
- 程式碼的網路字型
停用本機字型可讓您更輕鬆執行以下動作：
- 偵錯及評估網頁字型載入效能和最佳化
- 確認 CSS
@font-face規則的正確性 - 發現網路字型與本機版本之間的差異
模擬 @font-face 規則中缺少的 local() 個來源：
檢查上方句子，然後開啟「元素」Elements>在「Computed」下方向下捲動，然後在「Rendered Fonts」下方找到 Chrome 在本機檔案中找到的「Courier New」。
開啟「算繪」分頁，勾選「停用本機字型」，然後重新載入網頁。
查看 Roboto 在網路上找到的句子。
啟用自動深色模式
即使未實作深色模式，網站也能呈現出來。
Chrome 96 為 Android 上的 Auto Dark Theme 推出來源試用。使用者運用這項功能時，如果作業系統為使用者選擇採用深色主題，瀏覽器就會為淺色主題網站套用自動產生的深色主題。
如何啟用自動深色模式：
- 在這個頁面中，開啟「算繪」分頁，然後勾選「啟用自動深色模式」。
- 以深色模式觀察這個頁面。
模擬視覺障礙
Google 致力提供各項工具，Google 致力實現這一點。
透過 Chrome 開發人員工具，您可以查看視力障礙的使用者如何瀏覽您的網站，進而改善網站品質。詳情請參閱「模擬色彩視覺缺陷」。
如何模擬視覺障礙：
- 開啟「Rendering」分頁。
在「模擬視覺缺陷」下方，從下拉式選單中選取下列其中一個選項：
- 不模擬。
- 視力模糊。
- 降低對比度。
- 紅色盲 (看不到紅色)。對紅色的認知偏低；呈現綠色、紅色和黃色的模糊區域。
- 綠色盲 (無綠色)。對綠色的觀感不佳；呈現綠色、紅色和黃色的模糊區域。
- 突擊者 (不會顯示藍色)。藍色的感知弱；難以理解的綠色和藍色
- 色盲 (無顏色)。部分或全部缺少色視。
停用 AVIF 和 WebP 圖片格式
這類模擬可讓開發人員更輕鬆地測試不同的圖片載入情境，不必切換瀏覽器。
假設您具有下列 HTML 程式碼，可用於在新版瀏覽器上提供 AVIF 和 WebP 格式的圖片，並為舊版瀏覽器提供 PNG 備用 PNG 圖片。
<picture>
<source srcset="test.avif" type="image/avif">
<source srcset="test.webp" type="image/webp">
<img src="test.png" alt="A test image">
</picture>
如何停用網頁上的所有 AVIF 圖片 (或類似 WebP 圖片)：
- 開啟「算繪」分頁，然後勾選「停用 AVIF 圖片格式」。
- 請重新載入網頁，然後將滑鼠遊標懸停在
img src。目前的圖片 src (currentSrc) 現在是 WebP 圖片。
同樣地，您可以停用 WebP 圖片。