在Chrome浏览器使用CSS cursor属性时如何修改按钮背景？

Chrome 浏览器会默认将设置了 cursor: pointer 的元素识别为可交互元素，用户长按该类元素时会触发内置的 Discover 搜索功能，同时附带对应高亮背景效果，你可以通过以下方案修复：

修复方案 #

• 方案1：调整触摸行为属性
  给目标按钮添加 touch-action: manipulation 属性，既保留点击、平移等基础交互能力，又会禁用浏览器长按触发的搜索、缩放等额外行为，是兼容性最好的轻量解决方案：

.your-button-class {
  cursor: pointer;
  touch-action: manipulation;
}

• 方案2：禁用元素的长按选择与菜单
  如果你的按钮不需要支持文本选择、长按呼出上下文菜单的功能，可以添加以下属性从触发前提层面屏蔽该效果：

.your-button-class {
  cursor: pointer;
  user-select: none;
  -webkit-touch-callout: none;
}

• 方案3：完全禁用元素触摸默认行为
  如果该按钮是纯交互控件，不需要任何浏览器默认触摸行为，可以将属性改为 touch-action: none，彻底屏蔽所有触摸相关的默认触发逻辑。

注意：不推荐全局添加上述属性，会影响普通文本的选择、链接长按菜单等用户常用功能，仅给需要屏蔽效果的目标元素单独添加即可。

内容的提问来源于stack exchange，提问作者stevenH