css禁止文本或文字图标点击被选中

在做项目时，经常会用到一些文字图标，比如我们做轮播图时，可能就会用到阿里巴巴字体图标库中的图标进行切换轮播图。这时候我们不希望点击会被选中。我们就可以利用下面的css3中属性来禁止。

例如下面这种情况，我们就可以禁止：

右侧按钮为阿里巴巴字体图标库字图，点击被选中，就可以用下面的方法禁止。

用法：

span{-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;
}

浏览器支持情况：

属性的取值范围：

user-select：none | text | all | element

none：文本不能被选择

text：可以选择文本
all：当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素。
element：可以选择文本，但选择范围受元素边界的约束

css禁止文本或文字图标点击被选中相关推荐

html引导蒙层,web开发中实现图标点击态蒙层
原标题:web开发中实现图标点击态蒙层 webapp开发中经常需要加入点击二态,即用户点击(tap)页面某个部分时该部分的样式进行相应的变化来相应用户的点击操作,这样能够带来更好的用户体验,今天我们要 ...
【Android 性能优化】应用启动优化 ( 安卓应用启动分析 | Launcher 应用简介 | Launcher 应用源码简介 | Launcher 应用快捷方式图标点击方法分析 )
文章目录一. Launcher 应用简介二. Launcher 应用源码简介三. Launcher 图标点击方法分析一. Launcher 应用简介 Launcher 应用 : Android ...
加载网络图片Glide+圆角 fragment的动态添加底部图标点击选中
一.加载网络图片Glide+圆角 1.添加网络请求. <uses-permission android:name="android.permiss ...
删除AppData后出现任务栏图标点击没反应的解决方法
删除AppDate后出现任务栏图标点击没反应的解决方法本人因为C盘满了,一时手贱把c盘里面用户文件的AppData删除了,结果出现有些软件打不开,任务栏点击没反应.游览器插件丢失.软件的环境变量消失 ...
badboy录制网站出现css样式混乱，网页的图标点击没反应
本人在测试web工作过程中,遇到了标题一样的问题.苦恼很久也没有找到原因.后面自己摸索,发现了问题所在! badboy安装是2.2.5版本:ie最新版本: 原因:首次安装badboy的时候,所默认的浏 ...
html中文本不自动换行,CSS禁止文本自动换行代码
使用CSS样式 white-space:nowrap 可以定义某个区域内的内容是否可自动换行,默认是可以的.如果设置的值为 nowrap 将禁止自动换行,如上图所示.内容超过窗体可显示的区域外时将在浏 ...
【转】使用CSS 禁止文本选择
禁止文本选择有些时候我们需要对网页的文本内容进行简单的屏蔽,可以使用user-select这个CSS特性来实现这个需求. --不过需要注意一点,就是通过CSS设置是可以被浏览器禁用从而导致禁用功能失 ...
win10微软图标点击无反应_win10系统任务栏开始菜单等系统图标点击无反应的解决方法...
很多小伙伴都遇到过win10系统任务栏开始菜单等系统图标点击无反应的情况,想必大家都遇到过win10系统任务栏开始菜单等系统图标点击无反应的情况吧,那么应该怎么处理win10系统任务栏开始菜单等系统图 ...
html图标点击转换颜色,PNG格式小图标的CSS任意颜色赋色技术_html/css_WEB-ITnose
这篇文章发布于 2016年06月8日,星期三,01:17,归类于css相关. 阅读 3 次, 今日 2 次 byzhangxinxu from http://www.zhangxinxu.com 本文 ...

css禁止文本或文字图标点击被选中

css禁止文本或文字图标点击被选中相关推荐

最新文章

热门文章