CSS :focus-visible 偽類

定義和用法

CSS :focus-visible 偽類用于僅在通過鍵盤聚焦時應用焦點樣式,而不是通過鼠標聚焦時。

這可以與 :focus 結合使用,為鍵盤焦點和鼠標/觸摸焦點創建不同的焦點樣式。

實例

選擇并設置通過鍵盤 Tab 鍵獲得焦點的按鈕的樣式:

button:focus-visible {
  outline: 2px solid red;
}

親自試一試

CSS 語法

:focus-visible {
  css declarations;
}

技術細節

版本: CSS4

瀏覽器支持

表格中的數字指定了完全支持該偽類的首個瀏覽器版本。

Chrome Edge Firefox Safari Opera
86 86 85 15.4 72

相關頁面

教程:CSS 偽類

參考:CSS :focus 偽類