webkit-touch-callout
时间: 2023-12-06 17:04:01 浏览: 305
`-webkit-touch-callout`是一个CSS属性,用于控制iOS设备上长按链接或图片时的默认行为。默认情况下,长按链接会显示链接的URL并提示用户可以在新标签页中打开链接,长按图片会显示图片的URL并提示用户可以将其保存到相册。通过设置`-webkit-touch-callout`属性为`none`,可以禁用这个默认行为,使得长按链接或图片时不会弹出上述的选项菜单。
例如,下面的CSS代码可以禁用长按链接或图片的默认行为:
```
a, img {
-webkit-touch-callout: none;
}
```
相关问题
iOS 禁止超链接长按
在 iOS 上,可以通过 CSS 属性 `-webkit-touch-callout` 来禁止超链接长按事件的默认行为,也就是禁止出现菜单(比如打开链接、复制链接等)。具体来说,可以将该属性设置为 `none`,例如:
```css
a {
-webkit-touch-callout: none;
}
```
上面的代码会禁止所有超链接的长按菜单。如果只想禁止某些超链接的长按菜单,可以给它们添加一个特定的 class,然后通过 CSS 来指定:
```html
<a href="https://www.example.com" class="no-long-tap">Link</a>
```
```css
.no-long-tap {
-webkit-touch-callout: none;
}
```
这样就只会禁止带有 `no-long-tap` class 的超链接的长按菜单。注意,该属性只适用于 iOS 和 Safari 浏览器。
禁用鼠标右键菜单
可以通过以下几种方式禁用鼠标右键菜单:
1. 使用 JavaScript 禁用右键菜单,代码如下:
```
document.addEventListener('contextmenu', event => event.preventDefault());
```
2. 在页面中添加以下代码,禁用整个页面的右键菜单:
```
<body oncontextmenu="return false;">
```
3. 使用 CSS 禁用右键菜单,代码如下:
```
body {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
body * {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
body {
-webkit-touch-callout: none;
-moz-touch-callout: none;
-ms-touch-callout: none;
touch-callout: none;
}
```
注意,以上方法只是禁用了右键菜单,但用户仍然可以使用其他手段进行页面内容的复制和粘贴。
阅读全文