禁用链接 <a>
Syntax
/* Keyword values */
pointer-events: auto;
pointer-events: none;
pointer-events: visiblePainted;
pointer-events: visibleFill;
pointer-events: visibleStroke;
pointer-events: visible;
pointer-events: painted;
pointer-events: fill;
pointer-events: stroke;
pointer-events: all; /* Global values */
pointer-events: inherit;
pointer-events: initial;
pointer-events: unset;
Example
1 <a href="link.html" class="not-active">Link</a>
2
3 .not-active {
4 pointer-events: none;
5 cursor: default;
6 opacity: 0.6;
7 }
jQuery Example
1 // disable button
2 $("#myLink").css({ 'pointer-events': 'none' });
3 // enable it again
4 $("#myLink").css({ 'pointer-events': '' });
Bootstrap Disabled Link
1 <a href="#" class="btn btn-primary btn-lg disabled" role="button">Primary link</a>
2 <a href="#" class="btn btn-default btn-lg disabled" role="button">Link</a>
相关:
<style>
.disabled {
opacity: 0.6;
cursor: not-allowed;
}
</style>
禁用链接 <a>的更多相关文章
- bootstrap 表单元素、按钮、链接的禁用
在Bootstra中,表单元素,按钮通过在标签内设置 disabled 或 disabled="disabled" 可以禁用表单元素,按钮.链接需要加入class="di ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮:禁用状态
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- USB设备(移动硬盘、鼠标)掉电掉驱动的两种解决方案
症状: 当你发现"移动硬盘图标"经常无故消失,又自己出现时. 你可以把这个现象称之为"掉电" or "掉驱动". 遇到这种情况,相当不爽. ...
- bootstrap学习笔记--bootstrap组件
前面已经学习了bootstrap环境搭建以及基本布局方面的知识,下面将学习下关于bootstrap的相关组件,知识点有点多. 关于bootstrap组件知识点目录: Bootstrap--代码显示 B ...
- 让那些为Webkit优化的网站也能适配IE10
特别声明:此篇文章由David根据Charles Morris的英文文章原名<Adapting your WebKit-optimized site for Internet Explorer ...
- CSS/CSS3常用样式小结
1.强制文本单行显示: white-space:nowrap; 多行文本最后省略号: display: -webkit-box; -webkit-line-clamp:2; overflow: hid ...
- Bootstrap 按钮
本章将通过实例讲解如何使用 Bootstrap 按钮.任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: ...
- Bootstrap<基础十六> 导航元素
Bootstrap 提供的用于定义导航元素的一些选项.它们使用相同的标记和基类 .nav.Bootstrap 也提供了一个用于共享标记和状态的帮助器类.改变修饰的 class,可以在不同的样式间进行切 ...
- Bootstrap <基础七>按钮
任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: 以下样式可用于<a>, <butto ...
随机推荐
- 从show slave status 中判断mysql同步状态
slave status 中检查同步状态: 1.sql线程和io线程显示yes Slave_IO_Running: Yes Slave_SQL_Running: Yes 2. Master_Log_F ...
- 解决thinkPHP构造函数__construct导致tp方法冲突问题
我们在使用了__construct构造函数,覆盖了父类的构造函数,导致父类tp的方法无法使用,例如$this->display(),解决办法是: 在__construct函数中调用一下父类的构造 ...
- iframe自适应高度js
<iframe src="http://www.fufuok.com/" id="iframepage" name="iframepage&qu ...
- ellipsis
语法: text-overflow : clip | ellipsis 参数: clip : 不显示省略标记(...),而是简单的裁切(clip这个参数是不常用的!) ellipsis ...
- ajax实现文件上传
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...
- 文件代码对比软件 Beyond Compare
Beyond Compare https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=baidu&wd=Beyond%20Co ...
- BizTalk开发系列(三十三)BizTalk之Excel终极解决方案
Excel作为优秀的客户端数据处理程序得到了广泛的应用. 由于其简单又强大的功能在很多公司或个人的数据处理中占用非常重要的位置. 而BizTalk作为微软的SOA主打产品虽然免费提供了很多Adapte ...
- 用refresh控制浏览器定时刷新
package cn.itcast.response; import java.io.IOException; import java.util.Random; import javax.servle ...
- TypeScript学习记录
TypeScript官网 TypeScript中文网 TypeScrpit Handbook 中文版 DefinitelyTyped The TypeScript Definition Manager ...
- 使用Entity Framework 自动产生的Sql语句
对于一个单独实体的通常操作有3种:添加新的实体.修改实体以及删除实体. 1.添加新的实体 Entity Framework Code First添加新的实体通过调用DbSet.Add()方法来实现. ...