a span做成按钮样式不选中文字

a,span做成按钮样式时,文字会被选中.加以下CSS可以让其不选中.测试三大浏览器都可以

.button {
    display: inline-block;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

　　示例如下选择时,选不中

按钮a 按钮span

不加时,可以选中

不加

时间： 2024-08-11 03:36:17

a span做成按钮样式不选中文字的相关文章

CSS3特殊伪类::selection改变页面选中文字的样式

一般在网页上面,选中文字的时候,文字的样式是会改变的,当然,样式也都是千篇一律的浏览器的默认样式,蓝底白字,偶然看到有些网页上面当文字选中的时候会有不一样的样式,当时就很是好奇,后来才慢慢发现是css的一个伪类::selection ::selection是一个CSS3选择器(这也告诉这我们CSS3必须要去熟悉,这玩意确实可以弄出很多意想不到的好效果.) 兼容性:IE9+,Chrome,Opera,Safari,Firefox…(也可以去查看)caniuse.com#search=::selec

怎样用纯HTML和CSS更改默认的上传文件按钮样式

如果你曾经试过,你就会知道,用纯CSS样式加HTML实现统一的上传文件按钮可能会很麻烦.看看下面的不同浏览器的截图.很明显的,他们长得很不一样. 我们的目标是创造一个简洁,用纯CSS实现的,在所有浏览器里的样子和布局是一样的上传文件按钮.我们可以这样: 步骤1.创建一个简单的HTML标记 1 2 3 4 <div class="fileUpload btn btn-primary"> <span>Upload</span> <i

html 富文本编辑器相关--输出选中文字和主动选择文字

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div class="app" contenteditable="true"> <span id="con

uploadify 自定义按钮样式

uploadify是一款不错的JQUERY上传插件,但是FLASH按钮的外挂往往跟我们网页的设计不太搭配.一开始我还试图反编译uploadify.swf来修改其外观,结果发现反编译为FLA后里面没有任何图片资源. 原来,这个按钮是用CSS绘制的.代码文件是uploadify.css. 打开这个文件后,你会看见CSS设置的按钮样式.OK,现在想修改就很简单了,不论你是写一段新的CSS还是替换成图片都可以的. 我懒省事,就直接用图片作为按钮背景了. 代码: .uploadify-button { b

[HTML/CSS]uploadify自定义按钮样式

概述在项目中经常用到uploadify上传插件,但是FLASH按钮的外观往往跟我们网页的设计的主题色不太搭配.这时就需要对其样式进行修改. 样式文件是uploadify.css. 打开这个文件后,你会看见CSS设置的按钮样式. 1 .uploadify-button { 2 background-color: #505050; 3 background-image: linear-gradient(bottom, #505050 0%, #707070 100%); 4 background-

CSS+DIV网页样式与布局——文字样式&段落（一）

一个网页要说最多的还是文字,上篇博客说CSS样式是一个网页的精髓,那网页中最直接表现出来的就是文字和图片,还有一些所谓的表单,首先先说最为熟悉和常用的文字.让CSS控制网页中的文字,使它不再那么枯燥平淡,从此网页文字变得绚丽多彩. 一.文字样式文字样式主要包括文字的大小.颜色.字体等,具体包括如下写一个小例子,综合运用上述所有的文字效果样式: 代码: <html> <head> <title>文字字体</title> <style> body

改变滑动删除按钮样式

在自定义 cell 中实现如下代码: // 改变滑动删除按钮样式 - (void)layoutSubviews { [super layoutSubviews]; for (UIView *subView in self.subviews){ if([subView isKindOfClass:NSClassFromString(@"UITableViewCellDeleteConfirmationView")]) { CGRect cRect = subView.frame; cRe

屏蔽双击选中文字的方法

FF用样式 :-moz-user-select:none; FF以外的浏览器用:onselectstart="return false"(直接加在需要作用的标签) eg: <div class="test" onselectstart="return false" style="-moz-user-select:none;">你选不到我...(屏蔽双击选中文字的区域)</div>

按钮样式加载等待

使用插件Ladda,基于bootstrap的样式实现加载等待的效果: 首先引用.css以及.js文件: <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="dist/ladda-themeless.min.css"> <script src="dist/spin.min.js&