如何在 iOS 浏览器中为 UI 小猫输入组件删除这个蓝色轮廓

Question

当我在 ios 浏览器中打开我的应用程序时，我使用 UI Kitten + expo + react-native-web 作为我的项目，例如chrome，safari，聚焦时输入的文本有这个蓝色轮廓，例如：（我不能post图片所以我会post链接在这里，不便之处请见谅）

Chrome:

https://user-images.githubusercontent.com/75506336/156837622-412e947e-95d5-4836-b6fb-aa760a4c07c6.jpg

野生动物园：

https://user-images.githubusercontent.com/75506336/156837669-2c0d769a-6c63-4bed-842f-379d03057479.jpg

在桌面浏览器和 android 浏览器上，这个蓝色轮廓不显示，它只出现在 iOS 浏览器中，我该如何摆脱它？

谢谢！

Answer 1

/* Remove outline for non-keyboard :focus */
*:focus:not(.focus-visible) {
  outline: none;
}

/* Optional: Customize .focus-visible */
.focus-visible {
  outline-color: lightgreen;
}

我相信这就是您要找的