【问题标题】:Annoying Blue Highlighting around div after click点击后 div 周围出现恼人的蓝色突出显示
【发布时间】:2014-08-19 21:24:10
【问题描述】:

当我单击选项卡按钮时,我在 div 周围出现了这个恼人的蓝色突出显示...我在其他论坛上读到我应该将以下内容添加到有此问题的 div 中,但它不起作用。

            .noSelect {
                -webkit-user-select: none;
                -khtml-user-select: none;
                -moz-user-select: none;
                -o-user-select: none;
                user-select: none;
            }

您可以在此处仔细查看http://omarhabash.com/nova/?page_id=28

【问题讨论】:

  • 请不要链接到可以更改的外部资源。它破坏了你的问题对其他人的价值。见:meta.stackoverflow.com/questions/125997/…
  • @Diodeus 好吧,在这种情况下,他包含了一张图片和一些代码,然后为了额外的参考,他添加了链接。因此,它比仅包含链接要好得多。

标签: html css


【解决方案1】:

将此添加到您的 css 文件中!

.btn-group-justified > .btn-group .btn {
    width: 100%;
    outline: none;
}

更新: 每次都使用它来避免此类问题。

*:focus {
outline: 0;
outline: none;
}

【讨论】:

    【解决方案2】:

    使用这个类:

    .noSelect {
        -webkit-tap-highlight-color:transparent;
        -moz-tap-highlight-color:transparent;
        -o-tap-highlight-color:transparent;
        tap-highlight-color:transparent;
    }
    

    【讨论】:

    • 请解释一下你的答案
    • 感谢您提供此代码 sn-p,它可能会提供一些有限的即时帮助。 proper explanation would greatly improve its long-term value 通过展示为什么这是一个很好的解决问题的方法,并将使其对未来有其他类似问题的读者更有用。请edit您的回答添加一些解释,包括您所做的假设。
    【解决方案3】:

    这似乎是大纲。这是可访问性的默认浏览器功能。您可以使用outline 属性更改样式。

    类似这样的例子:

    .class {
        outline:none;
    }
    

    一些资源:

    演示:

    按 Tab,当您在链接上 Tab 时,您将看到大纲。

    http://jsfiddle.net/gzmnbfem/

    大纲移除演示:

    按 Tab,您将看不到轮廓。但是,这不是推荐的方法,因为它会破坏可访问性。

    http://jsfiddle.net/gzmnbfem/1/

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-12-04
      • 2018-06-12
      • 1970-01-01
      • 1970-01-01
      • 2013-09-07
      • 1970-01-01
      • 2012-09-28
      • 2014-06-22
      相关资源
      最近更新 更多