CSS有一个:模糊选择器(伪类)？

Question

CSS有一个:模糊选择器(伪类)？

53 css css-selectors pseudo-class

我知道有一个:focus选择器.我似乎无法找到:blur选择器的使用或文档.有吗？

Answer 1

Bol*_*ock 90

:blurCSS中没有伪类.

该动态伪类,像其他伪类,事实上所有其他选择,代表国家 ; 它们不代表文档树中的状态之间的事件或转换.即:在:focus伪类表示的元素是在焦点; 它不代表刚刚获得焦点的元素,也不存在:blur伪类来表示刚刚失去焦点的元素.

同样,这适用于:hover伪类.虽然它表示一个在其上有一个指针设备的元素,但是既没有指向:mouseover刚刚指向:mouseout的元素的伪类,也没有指向刚刚指向的元素的伪类.

如果需要将样式应用于不在焦点的元素,则有两种选择:

使用:not(:focus)(浏览器支持较少):

input:not(:focus), button:not(:focus) {
    /* Styles for only form inputs and buttons that do not have focus */
}

Run Code Online (Sandbox Code Playgroud)

声明适用于任何元素的规则,无论其焦点状态如何,并覆盖具有焦点的元素:

input, button {
    /* Styles for all form inputs and buttons */
}

input:focus, button:focus {
    /* Styles for only form inputs and buttons that have focus */
}

Run Code Online (Sandbox Code Playgroud)

`.button:not(:focus)` 会等于 `.button` 吗？他们选择相同但后者的特异性为 10，第一个的特异性为 20。 (3认同)
@Torsten Walter：不，他们是不同的；`.button` 将匹配该类的所有元素，无论它们是否处于焦点，而 `.button:not(:focus)` 永远不会匹配由 `.button:focus` 匹配的元素。一起使用`.button`和`.button:focus`的原因是为了利用级联。但是，是的，后者不太具体。 (2认同)
如果您只想在用户将注意力集中在左侧之后才对其进行样式设置怎么办？例如，您不想因为某人在加载页面时没有输入密码而大喊大叫，只有在他们离开输入之后。 (2认同)
@Marcel：然后，您将需要使用JavaScript事件处理程序，例如，使用与所需样式相对应的类来更新元素。CSS仅适用于状态，而不适用于事件，这意味着就CSS而言，一个元素要么处于焦点状态，要么不处于焦点状态。特别是，它不知道自页面加载以来该元素是否集中（除非您通过事后更新DOM来告诉它，只有脚本才能执行此操作）。 (2认同)

Answer 2

Utk*_*nos 5

不,CSS没有模糊伪选择器,可能是因为模糊更像是一个事件而不是一个状态.(目前还不清楚何时应该失去模糊状态).

归档时间：	13 年，1 月前
查看次数：	74009 次
最近记录：	9 年，4 月前