<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap 实例 - 表单控件大小</title>
<link rel="stylesheet" href="//cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="//cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body> <form role="form">
<div class="form-group">
<input class="form-control input-lg" type="text" placeholder=".input-lg">
</div>
<div class="form-group">
<input class="form-control" type="text" placeholder="默认输入">
</div>
<div class="form-group">
<input class="form-control input-sm" type="text" placeholder=".input-sm">
</div>
<div class="form-group">
</div>
<div class="form-group">
<select class="form-control input-lg">
<option value="">.input-lg</option>
</select>
</div>
<div class="form-group">
<select class="form-control">
<option value="">默认选择</option>
</select>
</div>
<div class="form-group">
<select class="form-control input-sm">
<option value="">.input-sm</option>
</select>
</div> <div class="row">
<div class="col-lg-2">
<input type="text" class="form-control" placeholder=".col-lg-2">
</div>
<div class="col-lg-3">
<input type="text" class="form-control" placeholder=".col-lg-3">
</div>
<div class="col-lg-4">
<input type="text" class="form-control" placeholder=".col-lg-4">
</div>
</div>
</form> </body>
</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:表单控件大小的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:表单帮助文本

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:表单控件状态

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:水平表单

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:内联表单

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:静态控件

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:选择框(Select)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:复选框(Checkbox)和单选框(Radio)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:文本框(Textarea)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. char **argv 与char *argv[]

    1.char **argv 分析:argv是一个指针变量,argv的指向(*argv)是char *,也就是argv指向的也是一个指针 : *argv的指向(**argv)是char. 2.char ...

  2. CCF认证 2019-12-3

    分析 后面的数据,坐标分布太离散,不能用一个二位数组来模拟垃圾分布.因此,考虑用一个数组记录每个垃圾点的位置. 先根据x坐标.再根据y坐标进行排序. 再遍历数组中的每一处垃圾点,判断其是否能建回收站( ...

  3. Spring Boot JWT 快速入门

    本章节讨论 jwt 在 spring boot 中的应用.意在快速入门 jwt. java jdk1.8 maven 3.2+ spring boot 2.0+ JSON Web Token(JWT) ...

  4. 一个含有Fibonacci Number的级数

    \[\Large\displaystyle \sum_{n=0}^\infty \frac{1}{F_{2n+1}+1}=\frac{\sqrt5}{2}\] \(\Large\mathbf{Proo ...

  5. 【CSS 】js操作css

    对设置和移除所有 <p> 元素的 "main" 类进行切换: $("button").click(function(){ $("p&quo ...

  6. HD Tune检查硬盘各参数的含义

    01 =Read Error Rate / (底层)数据读取错误率指从磁盘表面读取数据时发生的硬件读取错误的比率,Raw值对于不同的厂商有着不同的体系,单纯看做1个十进制数字是没有任何意义的.以上为W ...

  7. 【协作式原创】查漏补缺之Golang中mutex源码实现

    概览最简单版的mutex(go1.3版本) 预备知识 主要结构体 type Mutex struct { state int32 // 指代mutex锁当前的状态 sema uint32 // 信号量 ...

  8. 第一个Tornado程序

    环境:Python3.8 系统:win10 1903 工具:pycharm2019.3 import tornado.web # web服务基本功能都封装在此模块中 import tornado.io ...

  9. 笔记-pymysq-exception

    笔记-pymysq-exception 1.  exception DB API中定义了一些数据库操作的错误及异常,下表列出了这些错误和异常: 基本上是继承了Exception基类,没有添加额外功能. ...

  10. PAT A1131 Subway Map

    dfs,选择最优路径并输出~ 这道题难度非常炸裂,要求完完整整自己推一遍,DFS才算过关!思路:一遍dfs,过程中要维护两个变量,minCnt 中途停靠最少的站.minTransfer需要换成的最少次 ...