我有一个带有背景图像的div元素,我想在双击它时停止在div元素上突出显示。这是否有CSS属性?
答案 0 :(得分:131)
下面的CSS阻止用户选择文本。实例:http://jsfiddle.net/hGTwu/20/
-webkit-user-select: none; /* Chrome/Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */
/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;
要向下定位IE9,必须使用html属性unselectable
来代替:
<div unselectable="on">Test Text</div>
答案 1 :(得分:39)
这对我有用
html
{
-webkit-tap-highlight-color:transparent;
}
答案 2 :(得分:25)
我试图找到一种解决方案来阻止Chrome中的div突出显示,并转向此帖。 但不幸的是,没有一个答案解决了我的问题。
经过大量的在线研究,我发现修复非常简单。不需要任何复杂的CSS。只需将以下CSS添加到您的网页即可。这适用于笔记本电脑和移动屏幕。
div { outline-style:none;}
注意:这适用于Chrome版本44.0.2403.155 m。此外,今天所有主流浏览器都支持它,如本网址所述:http://www.w3schools.com/cssref/pr_outline-style.asp
答案 3 :(得分:7)
我没有CSS专家,但我认为只要扩大受影响的元素数量,就可以使用tw16的答案。例如,这可以防止在我的页面上的任何地方突出显示,而不会影响任何其他类型的交互:
*, *:before, *:after {
-webkit-user-select: none; /* Chrome/Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */
}
第一行是Paul Irish(通过http://adamschwartz.co/magic-of-css/chapters/1-the-box/)的礼貌。
答案 4 :(得分:2)
div::-moz-selection { background:transparent; }
div::selection { background:transparent; }
::-moz-selection { background:transparent; }
::selection { background:transparent; }
答案 5 :(得分:1)
禁用用户选择:
div {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
为所选元素设置透明背景:
div::-moz-selection { background:transparent; }
div::selection { background:transparent; }
答案 6 :(得分:0)
如果元素是可单击的,则可能希望使其成为按钮元素。