html+css移动端禁用长摁保存图片

Posted 2023-05-01

参考技术A     pointer-events 主要的用途还是穿透元素，该pointer-events属性允许用户穿过遮罩点击到下面的目标元素。

    在移动端html中，浏览器自带的长摁保存图片功能，及时是让图片作为div的一个背景都会被触发，所以我们可以使用时间穿透，来禁掉长摁保存图片。 pointer-events:none; 就可以了

pointer-events的其他属性值：

背景图片-密度屏幕（移动端）

.css {
  background-image: url([email protected]);
}

@media only screen and(-webkit-min-device-pixel-ratio: 2) {
  .css {
    background-image: url([email protected]);
  }
}
@media only screen and(-webkit-min-device-pixel-ratio: 3) {
  .css {
    background-image: url([email protected]);
  }
}

工具https://bjango.com/articles/min-device-pixel-ratio/