Html 使图像不可选择
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5983729/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Make images not selectable
提问by BDGapps
I am making a website in dreamweaver CS5. I exported the images from photoshop an inserted them into a table. When I view the site all the images are selectable(you are able to drag them to your desktop). How do I change this??? I want to do it with an onclick method in addition how would I achieve this?
我正在使用 Dreamweaver CS5 制作网站。我从 photoshop 导出图像并将它们插入到表格中。当我查看站点时,所有图像都是可选的(您可以将它们拖到桌面上)。这个怎么改???我想用一个 onclick 方法来做到这一点,另外我将如何实现这一点?
<td><img src="images/people_03.png" name="one" width="1000" height="156" id="one" ONCLICK="closeimages();"/></td>
采纳答案by awake12
Easiest way I think would be to make the images as css background images to each cell
我认为最简单的方法是将图像作为每个单元格的 css 背景图像
回答by BBog
I stumbled upon this question while struggling with the same problem but the accepted answer was not a possible solution for me.
我在解决同样的问题时偶然发现了这个问题,但接受的答案对我来说不是一个可能的解决方案。
I used the info found here, in particular adding the following styles to my body, inside the css (this worked for me in Firefox, Chrome and Opera, I cannot test for IE)
我使用了此处找到的信息,特别是在 css 中将以下样式添加到我的 body 中(这在 Firefox、Chrome 和 Opera 中对我有用,我无法测试 IE)
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
The unselectable html tag seems also helpful, but it's apparently supported only by IE and Opera:
不可选择的 html 标签似乎也有帮助,但显然只有 IE 和 Opera 支持它:
<img src="1.jpg" unselectable="on">
as well as the javascript solution, that is said to work on IE and webkit browsers:
以及 javascript 解决方案,据说适用于 IE 和 webkit 浏览器:
<script>
window.onload = function() {
document.body.onselectstart = function() {
return false;
}
}
</script>
Note. As Albert Renshawpointed in the comment this method no longer works in Chrome > 50.
注意。正如Albert Renshaw在评论中指出的那样,此方法不再适用于 Chrome > 50。
回答by Linh Dam
I would use pointer-events: none;
in my CSS
我会pointer-events: none;
在我的 CSS 中使用
img {
pointer-events: none;
}
回答by Amir Hossein Ahmadi
This works:
这有效:
pointer-events: none;
user-select: none;