Html 如何禁用图像上的突出显示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6816080/
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
How to disable highlight on a image
提问by Victor
I'm trying to disable highlight on image, when i move with my mouse on image and drag,
Take a look :
我正在尝试禁用图像上的突出显示，当我在图像上移动鼠标并拖动时，看看：
Thanks alot!
非常感谢！
采纳答案by Phil
img {
-khtml-user-select: none;
-o-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
回答by Victor
Use user-selectproperty:
使用用户选择属性：
img{
-khtml-user-select: none;
-o-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
回答by orlp
You can try this (this won't work in all browsers):
你可以试试这个（这不适用于所有浏览器）：
img::-moz-selection {
background-color: transparent;
color: #000;
}
img::selection {
background-color: transparent;
color: #000;
}
Or you can use a <div>with the appropriate width and height set and use a CSS background image on it. For example I use this on my site:
或者您可以使用<div>具有适当宽度和高度设置的 a 并在其上使用 CSS 背景图像。例如，我在我的网站上使用它：
<div id="header"></div>
#header {
height: 79px;
width: 401px;
background: url(http://nclabs.org/images/header.png) no-repeat;
}
And finally you can use Javascript to programatically disable it.
最后，您可以使用 Javascript 以编程方式禁用它。
回答by tskuzzy
This disabled highlighting on a DOM element:
这禁用了 DOM 元素上的突出显示：
function disableSelection(target){
if (typeof target.onselectstart!="undefined") // if IE
target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") // if Firefox
target.style.MozUserSelect="none";
else // others
target.onmousedown=function(){return false;}
target.style.cursor = "default";
}
Use it like this:
像这样使用它：
disableSelection(document.getElementById("my_image"));
回答by nakhli
Try to put it as a css background instead of an img element.
尝试将其作为 css 背景而不是 img 元素。
回答by Bhushana Rao Kadimi
img{
-ms-user-select: none; /* IE 10+ */
-moz-user-select: none; /* Firefox all */
-webkit-user-select: none; /* Chrome all / Safari all */
user-select: none; /* Likely future */
}
回答by Julien Le Coupanec
In case some people here are interested about the sass mixin:
如果这里有人对 sass mixin 感兴趣：
// Prevent users to select an element
@mixin no-select {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
回答by Aamer Shahzad
To remove the selection of text and images from entire website use body selector
要从整个网站中删除文本和图像的选择，请使用正文选择器
body {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
