自学bootstrap遇到的疑惑篇:
按钮状态——禁用
在Bootstrap框架中,要禁用按钮有两种实现方式:
方法1:在标签中添加disabled属性
方法2:在元素标签中添加类名“disabled”
两者存在区别:
“.disabled”样式不会禁止按钮的默认行为,比如说提交和重置行为等。
如果想要让这样的禁用按钮也能禁止按钮的默认行为,则需要通过JavaScript这样的语言来处理。
对于<a>标签也存在类似问题,如果通过类名“.disable”来禁用按钮,其链接行为是无法禁止。
而在元素标签中添加“disabled”属性的方法是可以禁止元素的默认行为的。
但是经过我自己的测试,发现不论是加上disabled还是加上.disabled类,鼠标都是无法点击的,这是因为在bootstrap中设置了禁用鼠标事件:
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
pointer-events: none;
cursor: not-allowed;
filter: alpha(opacity=65);
-webkit-box-shadow: none;
box-shadow: none;
opacity: .65;
}
但是可以通过键盘快捷键来完成按钮默认的行为事件;