禁用的输入框 input

如果您想要禁用一个输入框 input，只需要简单地添加 disabled 属性，这不仅会禁用输入框，还会改变输入框的样式以及当鼠标的指针悬停在元素上时鼠标指针的样式。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：表单控件状态(禁用)</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<form class="form-horizontal" role="form">
<div class="form-group">
<label for="disabledInput" class="control-label col-sm-2">禁用：</label>
<div class="col-sm-10">
<input type="text" id="disabledInput" class="form-control" placeholder="该输入框禁止输入"disabled="disabled" />
</div>
</div>
</form>
</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap历练实例：表单控件状态(禁用)的更多相关文章

  1. Bootstrap历练实例：表单控件状态(禁用的字段集fieldset)

    禁用的字段集 fieldset 对 <fieldset> 添加 disabled 属性来禁用 <fieldset> 内的所有控件. <!DOCTYPE html>& ...

  2. Bootstrap 表单控件状态(禁用状态)

    Bootstrap框架的表单控件的禁用状态和普通的表单禁用状态实现方法是一样的,在相应的表单控件上添加属性“disabled”.和其他表单的禁用状态不同的是,Bootstrap框架做了一些样式风格的处 ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单控件状态

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. Bootstrap之表单控件状态

    Bootstrap中的表单控件状态主要有三种:焦点状态,禁用状态,验证状态.   一.焦点状态:该状态告诉用户可输入或选择东西 焦点状态通过伪类“:focus”以实现. bootstrap.css相应 ...

  5. Bootstrap<基础六> 表单

    Bootstrap 通过一些简单的 HTML 标签和扩展的类即可创建出不同样式的表单. 表单布局 Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 垂直或基本表单 ...

  6. bootstrap学习笔记(表单)

    1.基础表单 :对于基础表单,Bootstrap并未对其做太多的定制性效果设计,仅仅对表单内的fieldset.legend.label标签进行了定制. fieldset { min-width: 0 ...

  7. Bootstrap历练实例：表单控件状态(焦点)

    输入框焦点 当输入框 input 接收到 :focus 时,输入框的轮廓会被移除,同时应用 box-shadow. <!DOCTYPE html><html><head& ...

  8. Bootstrap历练实例：响应式导航(带有表单)

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  9. Bootstrap历练实例：导航中的表单

    Bootstrap历练实例:导航中的表单,它是使用class.navbar-form类,这确保了表单适当的垂直对齐和在较窄的视口中折叠的行为,使用这个对齐方式选项来决定导航栏中的内容放置在哪里. 实例 ...

随机推荐

  1. PostgreSQL - 模糊查询

    前言 like.not like在SQL中用于模糊查询,%表示任意个字符,_表示单个任意字符,如果需要在模糊查询中查询这两个通配符,需要用ESCAPE进行转义,如下: select * from ta ...

  2. Java | 基础归纳 | trim()

    trim() 方法用于删除字符串的头尾空白符. 一般可以用来判断空白字符串的长度 String mName = “ ”: if(mName == null || mName.trim().length ...

  3. Codeforces 1119E（贪心）

    题目传送 贪心方法 按边从小到大扫,先凑3个,没凑足的记录一下数量,后面大的优先跟这些凑,俩带走一个,多余的再凑3个,再--就这样走到最后即可. const int maxn = 3e5 + 5; i ...

  4. （ 2018 Multi-University Training Contest 2）

    2018 Multi-University Training Contest 2) HDU 6311 Cover HDU 6312 Game HDU 6313 Hack It HDU 6314 Mat ...

  5. ORA-00972_标识符过长

    执行SQL查询报:"ORA-00972:标识符过长"错误. 执行SQL: SELECT T.F_FTBS, T.F_TZMC "X组/XXXX/XXXX名称", ...

  6. Hadoop启动datanode失败，clusterId有问题

    问题: 搭建伪Hadoop集群的时候,运行命令: hdfs namenode -format 格式化或者说初始化namenode. 然后用命令: start-dfs.sh 来启动hdfs时,jps发现 ...

  7. Linux--NiaoGe-Service-08（路由）

    路由 Linux系统下的路由表是由小到大排列的,即C类地址-->B类地址-->A类地址-->0.0.0.0(默认路由). Linux系统中使用route命令查看路由表 [root@w ...

  8. Azkaban的架构（三）

    Azkaban是什么?(一) Azkaban的功能特点(二) 不多说,直接上干货! http://www.cnblogs.com/zlslch/category/938837.html Azkaban ...

  9. 通用全局CSS样式

    PC全局样式 *{padding:0;margin:0;} div,dl,dt,dd,form,h1,h2,h3,h4,h5,h6,img,ol,ul,li,table,th,td,p,span,a{ ...

  10. 5、两个栈实现队列------------>剑指offer系列

    题目 用两个栈来实现一个队列,完成队列的Push和Pop操作. 队列中的元素为int类型. 思路 栈1: 用于入队列存储 栈2: 出队列时将栈1的数据依次出栈,并入栈到栈2中 栈2出栈即栈1的底部数据 ...