:focus

CSS伪类 :focus表示获得焦点的元素（如表单输入）。当用户点击或触摸元素或通过键盘的 “tab” 键选择它时会被触发。

/* Selects any <input> when focused */
input:focus {
  color: red;
}

提示：此伪类仅适用于焦点元素本身。如果要选择包含焦点元素的元素，请使用:focus-within 。

语法

:focus

<input class="red-input" value="I'll be red when focused."><br>
<input class="blue-input" value="I'll be blue when focused.">

.red-input:focus {
  background: yellow;
  color: red;
}

.blue-input:focus {
  background: yellow;
  color: blue;
}

Specification	Status	Comment
HTML Living Standard :focus	Living Standard	Defines HTML-specific semantics.
Selectors Level 4 :focus	Working Draft	No change.
Selectors Level 3 :focus	Recommendation	No change.
CSS Level 2 (Revision 1) :focus	Recommendation	Initial definition.

BCD tables only load in the browser