首页 > Web开发 > 详细

css禁止选中文本_兼容实现禁用选择功能

时间:2020-07-18 00:51:53      阅读:52      评论:0      收藏:0      [点我收藏+]

有时候,我们需要使页面内容不可选择。首先想到的是一个css属性:user-select。user-select有两个值:

none:用户不能选择文本 
text:用户可以选择文本  

 

禁用选择代码实现

html:

<p>你可以选择我。</p>
<p class="noselect">你不能选择我!</p>

  

css:

.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Chrome/Safari/Opera */
-khtml-user-select: none; /* Konqueror */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
not supported by any browser */
}

新片场https://www.wode007.com/sites/73286.html 傲视网https://www.wode007.com/sites/73285.html

需要注意的是:

1、user-select并不是一个W3C的css标准属性,浏览器支持的不完整,需要对每种浏览器进行调整  。

2、在 IE < 10 和Opera < 15中我们需要在需要禁止选中的元素上面添加一个属性unselectable="on",否则可能不会生效哦。

 

除了css外,我们同样可以使用js来实现:

document.body.onselectstart = document.body.ondrag =function(){
    return false;
}

  

 

 

css禁止选中文本_兼容实现禁用选择功能

原文:https://www.cnblogs.com/ypppt/p/13334062.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!