对于作用类似于按钮的锚点(例如,此 Stack Overflow 页面侧边栏上标题为问题, Tags, and Users)或选项卡,是否有 CSS 标准方法可以在用户意外选择文本时禁用突出显示效果?
我意识到这可以用 JavaScript 来完成,并且通过谷歌搜索得到了 Mozilla-only-moz-user-select
option.
是否有一种符合标准的方法可以使用 CSS 来实现此目的,如果没有,“最佳实践”方法是什么?
2017 年 1 月更新:
根据我可以用吗, the user-select
+ -webkit-user-select
适用于 Safari足以在所有主要浏览器中实现所需的行为。
这些是所有可用的正确 CSS 变体:
.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Old versions of Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
supported by Chrome, Edge, Opera and Firefox */
}
<p>
Selectable text.
</p>
<p class="noselect">
Unselectable text.
</p>
注意user-select
正处于标准化进程中(目前处于W3C 工作草案)。它不能保证在所有地方都能工作,并且浏览器之间的实现可能存在差异。此外,浏览器将来可能会放弃对其的支持。
更多信息可以在以下位置找到:Mozilla 开发者网络文档.
该属性的值为none
, text
, toggle
, element
, elements
, all
and inherit
.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)