删除我单击页面上的元素后出现的边框轮廓

时间:2015-11-10 14:56:59

标签: html html5 google-chrome

每次单击页面中的项目时,都会出现一条黑线,显示项目边界。

enter image description here

enter image description here

有没有办法不显示这一行?

解决方案后修改 我称之为边界轨迹实际上是一个用于更容易访问的轮廓(例如当使用Tab移动时)并且实际应该保留,或者替代使用它的位置。有关MarkPlewis的更多评论以及他的答案中的链接,以及Dirk-Jan对自己答案的评论。

3 个答案:

答案 0 :(得分:11)

我猜你在谈论焦点大纲。

要从网页上的所有元素中删除它,请使用以下代码段:

*:focus {
    outline: 0;
}

或者你只能将它设置在你不想要这个大纲的元素上。

答案 1 :(得分:4)

这是一种辅助功能。它允许用户使用键盘界面与您的网站进行交互。轮廓允许您查看当前具有焦点的元素。您可以使用以下CSS来抑制它,但不建议这样做。

*:focus {
    outline: none;
}

你可以read more about it here

如果您在政府网站上工作,则可能需要遵循严格的网络内容辅助功能指南。 WCAG 2.0级别AA explicitly states:“任何键盘可操作的用户界面都具有可以看到键盘焦点指示的操作模式。”

答案 2 :(得分:1)

我相信你可以用CSS解决这个问题:

*:focus {
    outline: 0;
}

这会将其从所有焦点元素中删除。 *是所有元素的选择器。 :focus是一个伪选择器,用于何时聚焦元素。您看到的大纲是outline CSS属性。