:focus
CSS伪类:focus表示获得焦点的元素(如表单输入)。当用户点击或触摸元素或通过键盘的tab键选择它时会被触发。此伪类仅适用于焦点元素本身。如果要选择包含焦点元素的元素,请使用:focus-within。
语法:
E:focus{sRules}
设置对象在成为输入焦点(该对象的onfocus事件发生)时的样式。

- webkit内核浏览器会默认给:focus状态的元素加上outline的样式。
- CSS伪类:focus表示获得焦点的元素(如表单输入)。当用户点击或触摸元素或通过键盘的tab键选择它时会被触发。
浏览器支持
例子
/* selects any when focused */input:focus {color: red;}
提示:此伪类仅适用于焦点元素本身。如果要选择包含焦点元素的元素,请使用:focus-within。
//HTML //CSS.red-input:focus {background: yellow;color: red;}.blue-input:focus {background: yellow;color: blue;}.demo2 .red-input:focus{background: yellow; color: red;}.demo2 .blue-input:focus{background: yellow; color: blue;}