Html 指针事件组合悬停css

我有一个需要防止人们保存或拖动的图像，所以我使用

pointer-events: none;

但我还想添加悬停效果缩放，如：

transform: scale(1.5);

---

有没有办法做到这一点？

您可以设置

指针事件：无，但将其包装在另一个元素中以触发悬停动作


。图像包装器{
显示：内联块；
溢出：隐藏；
字号：0；
}
.图像包装器：悬停img{
转换：比例（1.5）；
}
img{
过渡：全部。3放松；
指针事件：无；
}
正如您所看到的，
指针事件：无
将停止元素对任何鼠标移动或单击的反应，这不是您想要的

要防止拖动，只需将
draggable=“false”
属性添加到图像中即可

要取消单击，可以添加事件侦听器进行单击，然后调用
event.preventDefault（）
或
return false
。快速而肮脏的方法是：


不过，有很多方法可以将javascript附加到元素中

重要的是要知道，禁用单击和拖动不会阻止真正想要保存您的图像的人保存图像-如果有人真的下定决心，您也无法做任何事情。如果用户可以看到图像，则用户可以保存图像。这可能会让它变得更烦人，这对于您的情况可能已经足够了。
我想到了这一点，但是div.image-wrapper上的悬停效应会导致div本身缩小，我想要的是图像缩小，但仍然包含在div中不一定-查看此处的格式并运行代码段
image wrapper:hover img
是css选择器，意思是当wrapper div悬停在上方时，将样式应用到它包含的img。我不知道你可以将hover on img与一起使用。image wrapper工作得很有魅力，感谢Beenjamin给出的简洁答案，尽管我正在寻找纯cssNo问题的解决方案！我在这里的感觉是，CSS是一个“显示”层，因此，虽然您可以在某种程度上控制它的行为，但如果可能的话，在HTML本身中使用浏览器的本机行为会更加健壮。