CSS实现禁止文字选中】的更多相关文章

E10平台预览第四版中包含了对 CSS3 新属性 -ms-user-select 的支持,Web 开发人员可以利用这一新属性轻松精确的控制用户可以在网站上选择哪些文本. user-select:none | text | all | element text – 可以选择文本 element – 可以选择文本,但选择范围受元素边界的约束 none – 不可以选择文本 auto – 如果该元素包含可编辑的文本(如输入元素或可编辑内容的元素),则可以选择文本.否则,元素内容是否可选择由父节点的值决定…
// 禁止文字被鼠标选中 moz-user-select: -moz-none; -moz-user-select: none; -o-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none;…
现象:html中可能有些地方不想让用户复制文字,或是用a标签做了个点击按钮,点快的时候文字会被选中,很丑,这个时候可以使用下面的方案禁止文字选中. 原因:鼠标点快了文字会被选中. 解决方案:不同的浏览器设置的内容不一样,user-select不是一个W3C的标准,浏览器的支持不完成,需要对不同的浏览器进行调整. body{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:non…
需求:现在有一个需求是在移动端让你禁止用户选中文字,你会怎么做呢?如下图    解决方法:使用CSS3新增属性 user-select: none;   -webkit-user-select:none; -moz-user-select:none; -o-user-select:none; user-select:none;   该属性介绍:https://www.html.cn/book/css/properties/user-interface/user-select.htm#a3   使…
转载自:w3cui 在双击左右箭头,快速切换图片滚动时,会选择附近区域的文字,感觉不是很好,今天在同事在分享时,讲到了这个问题, 试了一下,不错,解决了问题IE及Chrome下的方法一样,对相应的元素添加onselectstart=”return false;”但是,这个在火狐下不起作用,但是火狐下可以用css样式来达到这个效果,即添加-moz-user-select:none;就可以兼容ie,google,firefox了,即代码如下所示: <div class="picBox"…
有时候,我们希望阻止用户选中我们指定区域的文字或内容. 举个栗子,有时候用户在一个区域执行频繁的点击操作,一不小心傲娇地点多了,就会选中当前区域的内容. 再举个栗子,制作轮播组件的时候,点击下一页,若点击的快的话,浏览器会识别为双击. 双击的默认效果是选中整片区域,这时候轮播图组件就会被表示忧郁的蓝色幕布盖住,多忧桑啊~ 你看,这妹子多赞啊,可是你一紧张就乱点下一张的话,就变成酱紫了: 不过别怕,给这个现代化浏览器说好了咱不要这种忧桑色调就可以了: .pretty-girl { -webkit-…
大家好,我是半夏,一个刚刚开始写文的沙雕程序员.如果喜欢我的文章,可以关注 点赞 加我微信:frontendpicker,一起学习交流前端,成为更优秀的工程师-关注公众号:搞前端的半夏,了解更多前端知识! 点我探索新世界! 原文链接 ==>http://sylblog.xin/archives/70 前言 在敲打自己的个人博客时,在博客的详情页,对于不同的内容,我是想有不同的复制方式的.例如代码块我就想读者单击就可以复制,这样方便读者本地调试,而对于文字描述部分,希望可以不允许读者复制.作为一个…
css实现网页中文字过长截取... title class应该这样写: .title{ width:300px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} 说明: 1.宽度一定要设置,可以根据实际需求调整. 2.white-space:nowrap是禁止文字折行. 3.text-overflow表示当文本溢出时是否显示省略标记,有两个值: clip:不显示省略标记(...),而是简单的裁切. ellipsis:当对…
一.CSS样式 解决文字过长显示省略号问题 1.一般样式 一般 css 样式,当宽度不够时,可能会出现换行的效果.这样的效果在某些时候肯定是不行的,可以修改 css 样式来解决这个问题. <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>text…
demo您可以狠狠地点击这里:js文字选中分享到新浪微博demo 方法与代码 选中即分享的功能看上去比较高级,其实实现是相当简单的.其中的会让人头大,一般人也不感兴趣的原理这里就直接跳过.这个js文字选中后分享到新浪微博的功能我简单的封装了下,方法名是:$sinaMiniBlogShare,当然,您不喜欢可以换掉,甚至不要,此方法完整代码如下: var $sinaMiniBlogShare = function(eleShare, eleContainer) { var eleTitle = d…