如何查看 -webkit-scrollbar 和 -webkit-scrollbar-track 等的默認 css styles 等？

Question

我正在嘗試查看 webkit 偽元素的默認 css 值（可能是源代碼？），以便我可以創建與默認值非常相似但稍微定制的自定義 webkit 項目。

這些項目是不顯示在 DOM 中的陰影元素。 您可以在 chrome devtools 設置中啟用“顯示用戶代理影子 DOM”， 使用開發人員工具檢查 webkit-input-placeholder ，但我仍然看不到 DOM 中的元素。 我懷疑用戶代理樣式表正在為這些 webkit 項目提供 styles

Answer 1

使用瀏覽器加載有問題的 CSS 頁面，然后您可以使用開發人員功能對其進行檢查。

1. 右鍵單擊頁面
2. 在 Chrome 中，菜單選項是“檢查”
3. 屏幕將分裂，頁面源出現在屏幕底部（不知道如果在手機上瀏覽會發生什么）
4. On the bottom of the screen, you will see the html, on the bottom right you will see the pertinent CSS you select some html on the right.
5. 注意最右邊有樣式表的鏈接，點擊查看
6. 不幸的是，該鏈接很難閱讀，因為所有空格和換行符都已刪除，但您可以將其粘貼到編輯器中，使其更易於閱讀