javascript - 关于html标签的焦点状态

Question

有哪些html标签是可以获取焦点状态的，都可以用：focus来定义获取焦点状态的时候的css么

Answer 1

1. 一般来说，focus都是用来修饰用户交互状态的，所以跟输入相关的标签都是可以用的，比如input,textarea;

2. 页面上支持tab切换的元素也可以用focus修饰，比如a链接，button按钮;

3. 另外，在HTML5中，任何元素都是可以用focus来修饰的，参考这里：https://css-tricks.com/almana...

Answer 2

W3C上的规范说明：The dynamic pseudo-classes: :hover, :active, and :focus

5.11.3 The dynamic pseudo-classes: :hover, :active, and :focus

Interactive user agents sometimes change the rendering in response to user actions. CSS provides three pseudo-classes for common cases:

The :hover pseudo-class applies while the user designates an element (with some pointing device), but does not activate it. For example, a visual user agent could apply this pseudo-class when the cursor (mouse pointer) hovers over a box generated by the element. User agents not supporting interactive media do not have to support this pseudo-class. Some conforming user agents supporting interactive media may not be able to support this pseudo-class (e.g., a pen device).
The :active pseudo-class applies while an element is being activated by the user. For example, between the times the user presses the mouse button and releases it.
The :focus pseudo-class applies while an element has the focus (accepts keyboard events or other forms of text input).
An element may match several pseudo-classes at the same time.

CSS does not define which elements may be in the above states, or how the states are entered and left. Scripting may change whether elements react to user events or not, and different devices and UAs may have different ways of pointing to, or activating elements.

加粗的那一段大概就是说，不指定哪些元素会有上述所说的几种状态，脚本也可以改变元素的交互状态，不同浏览器，不同设备也有对元素状态触发不同的解释等等，总的来说，应该是没有规定哪些元素可以使用 :focus 状态，所以我估计都可以写 css，但是用户交互等就需要程序进行相应的编写了吧，有些默认可以用户直接触发，有些则需要脚本方法等。

PS：英文水平有限，解读有误请及时指出~