吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单控件状态
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap 实例 - 表单控件状态</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body> <form class="form-horizontal" role="form">
<div class="form-group">
<label class="col-sm-2 control-label">聚焦</label>
<div class="col-sm-10">
<input class="form-control" id="focusedInput" type="text" value="该输入框获得焦点...">
</div>
</div>
<div class="form-group">
<label for="inputPassword" class="col-sm-2 control-label">
禁用
</label>
<div class="col-sm-10">
<input class="form-control" id="disabledInput" type="text" placeholder="该输入框禁止输入..." disabled>
</div>
</div>
<fieldset disabled>
<div class="form-group">
<label for="disabledTextInput" class="col-sm-2 control-label">禁用输入（Fieldset disabled）
</label>
<div class="col-sm-10">
<input type="text" id="disabledTextInput" class="form-control" placeholder="禁止输入">
</div>
</div>
<div class="form-group">
<label for="disabledSelect" class="col-sm-2 control-label">禁用选择菜单（Fieldset disabled）
</label>
<div class="col-sm-10">
<select id="disabledSelect" class="form-control">
<option>禁止选择</option>
</select>
</div>
</div>
</fieldset>
<div class="form-group has-success">
<label class="col-sm-2 control-label" for="inputSuccess">
输入成功
</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="inputSuccess">
</div>
</div>
<div class="form-group has-warning">
<label class="col-sm-2 control-label" for="inputWarning">
输入警告
</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="inputWarning">
</div>
</div>
<div class="form-group has-error">
<label class="col-sm-2 control-label" for="inputError">
输入错误
</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="inputError">
</div>
</div>
</form> </body>
</html>
吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单控件状态的更多相关文章
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单帮助文本
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单控件大小
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：水平表单
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：内联表单
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：静态控件
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：选择框（Select）
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：复选框（Checkbox）和单选框（Radio）
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：文本框（Textarea）
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- rapidxml读xml文件
student.xml文件内容: int readXML(void) { rapidxml::file<> file("student.xml"); rapidxml: ...
- unittest和unittest2的区别差异、unittest2框架------执行原理
unittest和unittest2的区别差异 参考:https://pypi.org/project/unittest2/ unittest2是Python 2.7及更高版本中添加到unittest ...
- .NET中的字符串(4):字符串 - 特殊的引用类型
字符串驻留 看一下这段代码: 1using System; 2 3namespace Demo4 4{ 5 /**//// <summary> 6 /// String的驻留 7 /// ...
- Linux 一些有用的能力
编程能力 Linux产生于一群真正的黑客.尽管人们习惯于认为Linus是Linux的缔造者,在linux包含的数以千计的文件中,也有一个名为Credits的文件记录了主要的Linux Hacker们的 ...
- spring boot整合Thymeleaf
1.引入thymeleaf: <dependency> <groupId>org.springframework.boot</groupId> <artifa ...
- idea代码神器：根据表生成代码
Easycode是idea的一个插件,可以直接对数据的表生成entity,controller,service,dao,mapper,无需任何编码,简单而强大. 1.安装(EasyCode) 我这里的 ...
- 理解API和SDK的区别
API--功能的集成(封装等级低) SDK--任务的集成(封装等级高) 比如,App中完成微信支付.整个过程下来需要三次与微信服务器的访问,一次block回调.这四个步骤可以当作是4个api,如果把这 ...
- MSSQL2005数据库快照（SNAPSHOT）初探
定义:数据库快照是数据库(称为“源数据库”)的只读静态视图.在创建时,每个数据库快照在事务上都与源数据库一致.多个快照可以位于一个源数据库中,并且可以作为数据库始终驻留在同一服务器实例上.在创建数据库 ...
- selenium webdriver 屏幕滚动
//山寨法 String setscroll = "document.documentElement.scrollTop=100"; JavascriptExecutor jse= ...
- ssh访问ubuntu13.10
步骤: 首先确保网络连接是ok,网络连接方式"桥接“,手动配置 ip 192.168.1.9,和主机是同一网段 1.检查当前有没有安装openssh-server(已安装) 2. 安装ope ...