用于在Chrome中具有焦点轮廓的元素的CSS选择器

用于在Chrome中具有焦点轮廓的元素的CSS选择器,css,google-chrome,focus,Css,Google Chrome,Focus,若你们在Chrome中按标签页导航,那个么通过添加一个大纲来表示对元素的关注。问题是轮廓是在外部绘制的,所以我需要对这些轮廓元素应用z索引,这样轮廓就不会被z索引高于聚焦元素的元素隐藏 我尝试了:focus选择器,但似乎一个元素可以在Chrome中聚焦,但没有轮廓(例如,如果用鼠标单击)。那么,将样式应用于所有轮廓图元和仅应用于轮廓图元的有效选择器是什么 编辑:我所说的没有轮廓的焦点的意思如下例所示: <style> a:focus{color:red} </style>

若你们在Chrome中按标签页导航,那个么通过添加一个大纲来表示对元素的关注。问题是轮廓是在外部绘制的,所以我需要对这些轮廓元素应用z索引,这样轮廓就不会被z索引高于聚焦元素的元素隐藏

我尝试了
:focus
选择器,但似乎一个元素可以在Chrome中聚焦,但没有轮廓(例如,如果用鼠标单击)。那么,将样式应用于所有轮廓图元和仅应用于轮廓图元的有效选择器是什么

编辑:我所说的没有轮廓的焦点的意思如下例所示:

<style> a:focus{color:red} </style>
<a href="#">abc</a><br>
<a href="#">def</a>
a:focus{color:red}


当您在这些链接上使用TAB键时,它们都按照:focus规则进行了样式设置和轮廓设置,但是当您用鼠标单击它们时,样式将被应用,但浏览器不会对元素进行轮廓设置。

为轮廓样式添加自定义css

a{border:1px solid#fff;}
a:焦点{颜色:红色;
大纲:无;
边框:1px实心#4D90FE;
-网络工具包盒阴影:0px 0px 5px#4D90FE;
盒影:0px 0px 5px#4D90FE;}


对于Firefox,您可以在选择器上阅读。

无大纲聚焦是什么意思?如果我创建一个简单的文本输入,并用鼠标选择它,它也会被聚焦吗
:focus
应该是正确的标记data:text/html,a:focus{color:red}
当您标记这些链接时,它们都会被勾勒出来并具有焦点样式。当你点击它们时,它们没有轮廓,但是有焦点样式。对!说得好<代码>a元素在单击时未获得轮廓。有了TAB,他们就有了。有一天我读到了一篇关于聚焦环选择器的文章,但我认为W3C并没有在这方面做任何事情。这并不是对他的问题的回答。他想要的是所有当前概述元素的选择器。