禁用的输入框 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. ZOJ3164【区间dp】

     题意: 有n个人,有一种关系叫做8g关系,给出m个关系,给出n个人的阵列 问你最多能拿走多少人,拿走以后相邻就是相邻了 思路: 典型的区间dp: dp[i][j] 代表 i-j 最多能去多少人: 如 ...

  2. [Xcode 实际操作]二、视图与手势-(4)给图像视图添加边框效果

    目录:[Swift]Xcode实际操作 本文将演示给图片添加颜色相框 import UIKit class ViewController: UIViewController { override fu ...

  3. 【OpenJ_Bailian - 4110】圣诞老人的礼物-Santa Clau’s Gifts （贪心）

    圣诞老人的礼物-Santa Clau’s Gifts  Descriptions: 圣诞节来临了,在城市A中圣诞老人准备分发糖果,现在有多箱不同的糖果,每箱糖果有自己的价值和重量,每箱糖果都可以拆分成 ...

  4. 51Nod 1272 最大距离 (栈或贪心)

    #include <cstdio> #include <queue> #include <cstring> #include <iostream> #i ...

  5. 测试 | 代码覆盖测试工具 | Eclemma

    安装: 打开eclipse,点击Help菜单下的Install New Software 在弹出的对话框中,点击Add 输入Name,如EclEmma 输入Location: http://updat ...

  6. mongodb javaapi网页版链接

    http://www.open-open.com/doc/view/abe58dc8d0114ef2bd34d0bbccd3691e

  7. python 基础(十五) socket编程

    SOCKET TCP协议: 有请求 有响应 称之为 tcp协议 是面向连接的协议 就是在收发数据之前 必须先要建立一个可靠的链接 三次握手 如:网站 UDP协议: 是一个非链接的协议 传输之前不需要键 ...

  8. Gym 101149I I - It's the Police

    http://codeforces.com/gym/101149/problem/I 考虑下面这个例子 4 3 1 2 1 3 1 4 应该是选 0 0 1 1这样是最优的,我们不选1号,因为如果选1 ...

  9. Linux--NiaoGe-Service-04

    操作系统版本:CentOS 6.10 x86_64 查看内核所获取到的网卡信息 [root@xueji ~]# dmesg | grep -in eth :e1000 ::-bit) :0c::6b: ...

  10. IO多路复用机制（转）

    1.简介 希望通过这篇文章,可以回答以下几个问题? 为什么需要IO多路复用? 什么是IO多路复用机制? IO多路复用的机制该怎么使用? epoll比select/poll相比,优势在哪里? 在了解I/ ...