`
lmh2072005
  • 浏览: 114138 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

让文字不能选中user-select

 
阅读更多

屏蔽选择的样式定义:-moz-user-select属性(只支持ff)。 
属性有三个属性值: 

1、 none:用none,子元素所有的文字都不能选择,包括input输入框中的文字也不能选择。 

2、 -moz-all:子元素所有的文字都可以被选择,但是input输入框中的文字不可以被选择。 

3、 -moz-none:子元素所有的文字都不能选择,但是input输入框中的文字除外。

IE浏览器下是通过 onselectstart=”javascript:return false;”事件来实现该功能。 

 

document.body.onselectstart = function(){

return false;

}

样式中定义:

 

body

{

     -moz-user-select:none;

    -webkit-user-select:none;

   gn:expression(this.onselectstart=function(){return false;})  /*ie6/7*/

}

可惜opera 对以上方式都不支持

在需要不让选中的标签中加入unselectable="on"   子标签不能继承都得加这个属性,有点麻烦。

模拟下不能选中的现象:

body{

color:#000;

}

body::selection

{

color:#000;

background:transparent;

}

或透明遮罩层覆盖文字

分享到:
评论

相关推荐

    css 让文字不被选中之-moz-user-select 属性介绍

    他在ie下也能选中文字,但是选中其他列表,不会选中文字,原来它是在不同div中,属于不同的范围,而同事是放在同一个table中,当然会选中。 而在firefox下,文字不会被选中,查看google calender的css,原来还有-moz...

    -moz-user-select与onselectstart 禁止选择文字的方法

    在网页开发中,有时我们需要禁止用户通过鼠标选择页面上的文本,比如在密码输入框中,为了保护用户隐私和安全,不希望用户能一次性选中所有字符进行复制或删除。这时,我们可以利用CSS和JavaScript的特性来实现这一...

    CSS禁止文字选择user-select应用

    none:用户不能选择文本 text:用户可以选择文本 需要注意的是:user-select并不是一个W3C的CSS标准属性,浏览器支持的不完整,需要对每种浏览器进行调整 复制代码代码如下: body{ -moz-user-select: none; /*...

    vue实现页面内容禁止选中功能,仅输入框和文本域可选

    -webkit-user-select:none; /*webkit浏览器*/ -khtml-user-select:none; /*早期浏览器*/ -moz-user-select:none;/*火狐*/ -ms-user-select:none; /*IE10*/ user-select:none; } input{ -webkit-user-select:au

    通过CSS规则禁止选中文字的实现代码

    复制代码代码如下:(-prefix-)user-select: none;(-prefix-)user-select: text;(-prefix-)user-select: all;(-prefix-)user-select: element; 示例 复制代码代码如下:.row-of-icons { -webkit-user-select: none; /*...

    解除网页文字复制限制

    2. **CSS禁用选择**:通过设置CSS属性`user-select`为`none`,可以阻止用户选中文本。例如:`* { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }` 3. **框架和...

    鼠标移动div时禁止选中div中的文字的方法

    首先,我们可以使用CSS样式来禁止文字选中。一种通用的跨浏览器的解决方案是使用`user-select`属性。这个属性允许我们控制元素及其子元素是否可被用户选中。在CSS中添加以下样式: ```css html, body { -moz-user-...

    禁止选中文字兼容IE、Chrome、FF等

    代码如下: $(el).attr(‘unselectable’,’on’) .css({‘-moz-user-select’:’-moz-none’, ‘-moz-user-select’:’none’, ‘-o-user-select’:’none’, ‘-khtml-user-select’:’none’, /* you could also ...

    js鼠标移动时禁止选中文字

    在JavaScript编程中,有时我们需要禁止用户在网页上通过鼠标选择文字,这可能是因为要保护页面内容不被复制,或是为了优化交互体验。本篇文章将详细讲解如何使用JS和CSS来实现这一功能。 首先,禁止选中文字主要是...

    文字不能被选中,图片不能被下载

    ### 文字不能被选中,图片不能被下载:提高自身安全性 在当今互联网时代,网络安全和个人信息安全变得尤为重要。为了防止信息被盗用或者滥用,很多网站和应用会采取一系列措施来保护用户的数据安全。其中一种常见的...

    jquery防windows系统选中图标效果

    不可选中的文字和图标 ``` 在这个例子中,我们创建了一个类名为`unselectable`的CSS类,并设置了`user-select`属性为`none`。然后使用jQuery的`on`方法监听`mousedown`、`mouseup`和`mousemove`事件,并在事件...

    禁止复制网页指定区域的文字.rar

    在网页设计中,有时开发者或网站所有者希望保护他们的内容不被随意复制,这可能是出于版权保护、防止恶意抄袭或其他商业考虑。我们将探讨这一主题,包括如何禁止复制文本以及这种做法的局限性。 在HTML中,虽然没有...

    利用CSS实现禁止双击选择页面内容的实例展示

    这种方法在处理网页交互时特别有用,例如,当用户双击左右箭头快速切换图片滚动时,避免选中附近的文字。 描述中提到,通常情况下,双击会触发文本选择,这可能会导致在滚动图片时意外选中文字。为了解决这个问题,...

    在HTML5中如何使用CSS建立不可选的文字

    在此属性的值中,`none` 关键字使得用户不能选中该元素内的任何文本。当一个元素的样式中包含 `-webkit-user-select: none;`,那么该元素的文本就不能被鼠标或者触控选择。 我们从给定的文件内容中看到,使用了 `-...

    在HTML5中你如何使用CSS建立不可选的文字

    在CSS中,实现不可选文字的属性是`user-select`,该属性可以控制用户是否可以选中文本。下面将详细介绍如何在HTML5文档中使用`user-select`属性以及相关的浏览器前缀。 ### user-select属性 `user-select`属性是...

Global site tag (gtag.js) - Google Analytics