css - 在网页上关注并显示当前聚焦的元素

标签 css google-chrome

我想通过部署的网页调试选项卡索引流。当前的 css 在许多输入元素上都有 outline:none。

在 chrome 中,执行全局 css 覆盖的最佳方法是什么,以便我在浏览网站时可以清楚地看到选定/聚焦的元素?

最佳答案

检查页面上的元素(右键单击它并选择“检查”),在元素选项卡中右键单击它,从列表中选择“:focus”,查看样式选项卡(应该已经打开)对于设置 outline:none 规则的样式规则,取消选中所有 outline:none 样式旁边的复选框(您可能需要从多个规则中滚动或取消选中它们)。这将允许您在浏览器中看到默认的大纲样式,而无需更改生产代码。每次打开页面进行测试时,您都必须重复这些步骤。

编辑:这些步骤应该涵盖您需要这样做的大多数情况。如果您确实需要全局规则,也可以通过单击样式选项卡中的“+”图标并添加类似于 *:focus{outline:initial !important} 或类似的规则来添加。

关于css - 在网页上关注并显示当前聚焦的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34884387/

相关文章:

css - 加载时闪烁的 CSS3 动画

html - 为什么背景图像只显示在括号中的实时预览中

javascript - WebSQL事务报错存储空间不够?

Angular5 调试在 Chrome 中不起作用

html - -webkit-box 不收缩

Css 剪辑路径之间没有间隙

Javascript, CSS 优化器

sockets - Chrome 挂起 "sending request"似乎与套接字有关

javascript - 视差,作为主页横幅

css - 如何为 iPad Chrome 浏览器预加载图像?