making images on a website/page unsaveable?

I have been trying to find a way to show an image on a webpage but make sure the user wont be a开发者_如何学Pythonble to save it, anyone knows anything about?

---

You can make it difficult, but you cannot make it impossible.

If an image shows up on screen, it can be screenshotted.

---

Matt Ball is right. But what you may do is to define a div-container and set your image as the background-image. In most cases this will do.

---

This should work with the attributes I added! You can change what to src to.

<img src="https://grav-kodeklubb.github.io/cdn/img/icon.png" oncontextmenu="return false;" draggable="false">

The oncontextmenu="return false;" attribute will prevent right-clicking on the image

The draggable="false" will prevent users from dragging the image.

The above solution will go a long way to preventing others from using images from your webpage.

But there's no 100% solution to your request because users can still screenshot the image, and they can also be maybe better protected on the middle of tie image a copyirhgt.

---

Per Matt Ball you won't have much luck keeping it from being saved.

Adding a watermark is another option.

---

Here is the solution. Edit "customprotectclass" with your own name including the ones containing "customprotectclass".

.customprotectclass { position: relative; display: inline-block; }

.customprotectclass img { vertical-align: bottom; }

.customprotectclass:after {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: 0; right: 0;
  z-index: 1;
}

<div class="customprotectclass">
  <img src="http://google.com/favicon.ico"/>
</div>