禁用的输入框 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. printf汇总

    Reference: http://www.cplusplus.com/reference/cstdio/printf/ printf("%02d:%02d:%02d.%03d", ...

  2. PyCharm的一些使用技巧

    定位到函数定义 在函数名处 Ctrl + B 就会快速定位到函数定义处 在Console中执行文件 全选内容后,右键菜单 Execute Selection in Console 或者快捷键 Alt ...

  3. cogs 1176. [郑州101中学] 月考

    1176. [郑州101中学] 月考 ★   输入文件:mtest.in   输出文件:mtest.out   简单对比时间限制:1 s   内存限制:128 MB [题目描述] 在上次的月考中Bug ...

  4. 黑马tomact学习一 tomcat下载 安装和卸载

  5. 基于PHP的正则表达式

    用法 从某个字符抽取信息 用新文本替换匹配的文本 把字符串拆分成小块字符串组成的数组 基础 preg_match('/需要匹配的正则表达式/', '字符串'); 正则匹配模式 集合: [xxxx]-- ...

  6. 在 Linux 环境直接复移动硬盘上的 GRUB

    手头有一块用了 10 年的旧移动硬盘,其中安装了 Debian 系统,从低版本一直升级到现在的 9 已经用了很长时间.前不久正连着那块硬盘跑着 Debian 修改文件的时候,由于一个本可避免的意外震动 ...

  7. 081 Search in Rotated Sorted Array II 搜索旋转排序数组 ||

    这是 “搜索旋转排序数组”问题的跟进:如果数组元素允许重复,怎么办?这会影响到程序的时间复杂度吗?会有怎样的影响,为什么?假设按照升序排序的数组在预先未知的某个关键点上旋转.(例如, 0 1 2 4 ...

  8. 109 Convert Sorted List to Binary Search Tree 有序链表转换二叉搜索树

    给定一个单元链表,元素按升序排序,将其转换为高度平衡的BST.对于这个问题,一个高度平衡的二叉树是指:其中每个节点的两个子树的深度相差不会超过 1 的二叉树.示例:给定的排序链表: [-10, -3, ...

  9. 删除cookie时遇到的坑

    曾经有个“导出中”的需求,我用iframe实现下载对话框和cookie轮询验证token去解决的,但是昨天又发现了一个新问题: 因为前台需要提示导出失败的详细信息,这个信息我是在token返回0的时候 ...

  10. Less学习（2）（完结）

    七.模式匹配与Guard表达式 根据传入参数的不同,引入不同的属性集. .mixin (dark, @color) { color: darken(@color, 10%); } .mixin (li ...