禁用的输入框 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. HDU5904【瞎搞】

    哇咔咔,挂完. 靠着hack的100分挂在了rank167... 就是memset的问题,超时了:用map好了.. 思路: 标记a串以当前值为尾的上升子序列长度,然后还是搞b串,每次判一下当前值在a串 ...

  2. github新手使用

    1.首先要先在github的官网注册一个属于自己的账号.https://github.com/ 2.注册完成后需要一些简单的设置,先创建一个属于自己的仓库,repository 3.创建仓库 4.如何 ...

  3. Mecanim动画系统 - 在角色上使用Mask 叠加动画层

    http://www.narkii.com/club/thread-305706-1.html 2013-10-9 01:15 上传 下载附件 (78.65 KB) 导读:五分钟了解Mecanim角色 ...

  4. P4443 [COCI2017-2018#3] Dojave(线段树)

    传送门 设\(lim=2^n-1\),对于一个区间\([l,r]\)来说,如果\(sum\neq lim\)且能换出\(x\)并换进\(y\)来,使得\(sum\bigoplus a_x\bigopl ...

  5. 洛谷P4570 [BJWC2011]元素(线性基)

    传送门 不知道线性基是什么东西的可以看看蒟蒻的总结 考虑贪心 将所有的矿石按价值从大到小排序 如果一块矿石不会和之前的编号异或为0就加入 这个只要判一下它能不能加进线性基里就可以了 据说这个贪心的证明 ...

  6. Node.js 关于module的一些认知

    module是一个对象,在Node环境中运行js脚本,module会自动添加,并且系统会将函数封装到另一个函数中 例如: var module = { id: '.', exports: {} }; ...

  7. bzoj1458士兵占领

    传送门 和上一题差不多,每行和每列分别看做一个点,障碍点坐标的行和列就不建边,再按照有源汇上下界建图就好了,唯一的区别就是这个题求的是最小流 这个题的数据好水呢,建错图也能A呢 #include< ...

  8. idea | SpringBoot项目热加载

    第一步: 在pom文件添加依赖: <dependency> <groupId>org.springframework.boot</groupId> <arti ...

  9. 【bzoj1731】Layout 排队布局

    1731: [Usaco2005 dec]Layout 排队布局 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 868  Solved: 495[Subm ...

  10. BZOJ1108(思路)

    题目本质:因为只能往南和往东走所以不管怎么组合方案结果都是一样的Orz……我太菜了想不到嘤嘤嘤 #pragma comment(linker, "/STACK:1024000000,1024 ...