我正在使用 Boostrap 4 构建一个 Web。一个简单的代码如下：
<div class="col-12 p-2" id="Maincourse">
<h1 class="m-0">Main course</h1>
</div>
我使用我的 Android Chrome 浏览器（版本 80.0.3987.149）点击文本，它会突出显示文本并弹出谷歌搜索。
如何禁用它？我不想设置user-select: none，因为我需要让用户在长按时突出显示文本。
【问题讨论】：
标签： javascript jquery html css bootstrap-4
.disable-select {
user-select: none; /* standerd */
-moz-user-select: none; /* firefox specific */
-webkit-user-select: none; /* Chrome, Opera and Safari*/
-ms-user-select: none; /* IE, ms-edge */
}
来源1：https://www.w3schools.com/cssref/css3_pr_user-select.asp
来源2：https://developer.mozilla.org/en-US/docs/Web/CSS/user-select
版本兼容性
desktop:
Chrome: 54+
Firefox: 69+
Opera: 15+
Safari: 3+
MS Edge: 12+
IE: 10+
mobile
Chrome for Android: 54+
Android web-view: 54+
Firefox for Android: 4+
Opera for Android: 14+
Safari on IOS: 3+
有关更多信息和版本兼容性，请参阅来源。
【讨论】：
:active伪帮助帮助你。
通过在包装器中添加role="dialog" 解决了我的问题。
但我不知道为什么，谁能解释一下？
【讨论】：
试试这个：
-webkit-tap-highlight-color: transparent;
【讨论】：
我已经为此做了一段时间的user-select: none 修复，发现它并不令人满意，所以我开始四处寻找该功能的正确名称，以查看是否有更好的修复/编写它和我看到了 Paul Kinlan 的这篇 Google Developers 帖子（显然该功能被称为“触摸搜索”）：
https://developers.google.com/web/updates/2015/10/tap-to-search
其中详细描述了行为以及您可以禁用或启用该行为的各种方式。
与您的问题相关的摘录：
对任何可选择且非交互或不可聚焦的纯文本启用点击触发。当页面具有响应点击文本的点击处理程序时，Touch to Search 会自动检测响应并忽略它，因为我们知道开发人员打算处理该事件。使用触摸并按住手势手动选择文本也会触发触摸搜索栏。用户可以使用 Chrome 隐私设置下的首选项启用或禁用该功能。
作为网站的作者，您经常不希望某个元素上的点击手势触发搜索。为确保 Chrome 能按照您的意愿行事，请制作以下元素：
- 可聚焦：在元素上添加 tabindex=-1 属性。
- 交互式：使用多种标准方法中的任何一种来指示元素是交互式的：
- 使用可访问性标记来指示元素具有小部件角色或小部件属性。例如，任何带有 role=button 的元素都不会触发。添加辅助功能标记还有一个额外的好处，即您的页面将更容易被视障用户阅读。
- 任何调用 preventDefault() 或操作 DOM 或 CSS 的 JavaScript 点击处理程序都不会触发 Touch-to-Search。
- 不可选择：使用-webkit-user-select：无；即使使用长按手势，不可选择的文本也不会触发触控搜索。
【讨论】：