如何禁用使用CSS的文本选择高亮显示? [英] How to disable text selection highlighting using CSS?

查看:432
本文介绍了如何禁用使用CSS的文本选择高亮显示?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

对于类似于按钮的锚点(例如,在堆栈顶部的问题标签用户页面)或制表符,如果用户不小心选择文本,有没有CSS标准的方式禁用突出效果?

For anchors that act like buttons (for example, Questions, Tags, Users, etc. at the top of the Stack Overflow page) or tabs, is there a CSS standard way to disable the highlighting effect if the user accidentally selects the text?

我意识到这可以使用JavaScript完成,小搜索会产生仅限Mozilla的 -moz-user-select 选项。

I realize this could be done with JavaScript, and a little googling yielded the Mozilla-only -moz-user-select option.

是否符合标准

推荐答案

更新2016年:

根据我可以使用,除了Internet Explorer 9和早期版本以外的所有浏览器目前都支持用户选择(但仍然可以

According to Can I use, the user-select is currently supported in all browsers except Internet Explorer 9 and earlier versions (but sadly still needs a vendor prefix, at least on Firefox).

所有正确的CSS变体包括:

All of the correct CSS variations are:

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  not supported by any browser */
}

<p>
  Selectable text.
</p>
<p class="noselect">
  Unselectable text.
</p>

请注意,这是一个非标准功能(即不是任何规格的一部分)。它不能保证在任何地方工作,并且在浏览器之间可能有不同的实现,并且在未来的浏览器可以放弃对它的支持。

Note that it's a non-standard feature (i.e. not a part of any specification). It is not guaranteed to work everywhere, and there might be differences in implementation among browsers and in the future browsers can drop support for it.

有关详情,请参阅 Mozilla开发人员网络文档

这篇关于如何禁用使用CSS的文本选择高亮显示?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆