根据https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible上的示例(在基本示例下),单击带有占位符":focus-visible only"用我的鼠标不应该显示橙色的轮廓样式-但它确实显示了。Caniuse.com告诉我,我的chrome版本支持:focus-visible。
提示吗?
工作草案规范声明浏览器制造商可以自由选择他们自己的标准来匹配:focus-visible
,而不仅仅是常规的旧:focus
,但规范确实推荐了一些建议作为起点,包括:
任何支持键盘输入的元素(例如输入元素…)在聚焦时都应该始终匹配
:focus-visible
。
对我来说,这表示所有输入元素都应该始终匹配:focus-visible
。
在您引用的示例中,您将注意到按钮的行为与预期一致。如果你用鼠标点击按钮,它不匹配:focus-visible
,但如果你用键盘导航选择它,它匹配。
css为我工作
为桌面
.momsType:focus-visible{
outline:none!important;
}
移动
.momsType:focus{
outline:none!important;
}