禁用的输入框 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. [Xcode 实际操作]八、网络与多线程-(25)实现ShareSdk的社会化分享功能

    目录:[Swift]Xcode实际操作 完成开发包的安装和配置之后,本文将演示社会化分享功能的具体开发步骤. 在项目导航区,打开并编辑程序代理文件[AppDelegate.swift] import ...

  2. 详解什么是redis

    企业中redis是必备的性能优化中间件,也是常见面试题,首先Redis是由意大利人Salvatore Sanfilippo(网名:antirez)开发的一款内存高速缓存数据库.Redis全称为:Rem ...

  3. 1.python真的是万恶之源么?(初识python)

    python真的是万恶之源么? 计算机基础及puthon了解 1.计算机基础知识 cpu : 相当于人类大脑,运算和处理问题 内存 : 临时存储数据,单点就消失,4G,8G,16G,32G 硬盘 : ...

  4. Tomcat日志文件的输出在Linux和Windows下的差异

    前言 最近老大发现Tomcat的日志文件catalina.out里存在着大量的和公司项目相关的log信息,因为一般都是会使用日志框架并另外将log信息输出到另外的文件里的,catalina.out文件 ...

  5. mysql ERROR 2003 (HY000): Can't connect to MySQL server on '' (10060

    关闭防火墙即可连接成功: systemctl stop firewalld

  6. PAT甲级——1134 Vertex Cover （25 分)

    1134 Vertex Cover (考察散列查找,比较水~) 我先在CSDN上发布的该文章,排版稍好https://blog.csdn.net/weixin_44385565/article/det ...

  7. ZROI #365. 【2018普转提day18专题】嘤嘤嘤嘤

    ZROI #365. [2018普转提day18专题]嘤嘤嘤嘤 直接放代码 具体做法见注释 #include<stdio.h> #include<cstring> #inclu ...

  8. python之序列化json模块与pickle模块(待补充)

    一.json是所有语言都通用的一种序列化格式 只支持 : 列表,字典字符串,数字,且字典的key必须是字符串 ''' 1. dumps , loads 在内存中做数据转换: dumps : 数据类型 ...

  9. python-函数进阶-动态传参,名称空间,作用域的问题

    一.函数的动态的动态参数 动态参数分为两种:动态接收位置参数.动态接收关键字参数. 1.*args  位置参数动态传参 # 顺序: 位置参数=>*args(arguments) => 默认 ...

  10. 转 错误：ORA-28002/ORA-65162 ： the password will expire within 7 days 解决方法

    今天在使用sqlplus时出现 =============================================== ERROR:ORA-28002: the password will e ...