<!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. zookeeper的安装（单机版）

    一.获取zookeeper的安装包 zookeeper的官网下载:wget  https://archive.apache.org/dist/zookeeper/zookeeper-3.4.10/zo ...

  2. php引入html页面 css报错 404

    php引入html页面 css报错 404, html页面内 有css, 有一样 是这么写的 结果就报错了, 原来是 -moz这一句,在这句前面随便加一句别的样式就可以....

  3. 爬虫必备工具-chrome 开发者工具

    在某个网站上,分析和抓取数据,我们用的最多的工具就是 Chrome 开发者工具 01 元素面板 通过元素(Element)面板,我们能查看发哦想抓取页面渲染内容所在的标签.使用什么 CSS 属性(例如 ...

  4. Ubuntu18 mongodb 离线安装

    环境 Ubuntu 18 + mongodb 4.0.10 1.下载版本所需库 https://www.mongodb.com/download-center/community https://re ...

  5. 需要写的CSS博客

    重绘与回流 BFC 水平垂直居中 定位 基线各种线 inline-block,img标签空字符

  6. 吴裕雄--天生自然Numpy库学习笔记：NumPy 字节交换

    大端模式:指数据的高字节保存在内存的低地址中,而数据的低字节保存在内存的高地址中,这样的存储模式有点儿类似于把数据当作字符串顺序处理:地址由小向大增加,而数据从高位往低位放 小端模式:指数据的高字节保 ...

  7. BUG搬运工：CSCun88303-CIMC Memory Leak : Can't SSH/HTTP to CIMC

    Symptom:Unable to SSH/HTTP to the CIMC of the C-series server, however the CIMC can be pinged. Also ...

  8. 思科Catalyst 9K

    思科的新一代产品Catalyst9K,里面涉及了Catalyst9200.Catalyst9300.Catalyst9400.Catalyst9500.Catalyst9600和Catalyst980 ...

  9. java中使用静态字段和构造函数跟踪某个类所创建对象的个数

    对于这个问题,我们都知道java中使用类时会自动调用构造函数.按照这个思路我们可以定义一个static int 形的常量count 然后将count++放入这个类的构造函数中,这样只要输出count的 ...

  10. XC1263 签到题（哇 ，写得我怀疑人生啊！！！@！@）

    1263: 签到题 时间限制: 1 Sec  内存限制: 128 MB提交: 174  解决: 17 标签提交统计讨论版 题目描述 大家刚过完寒假,肯定还没有进入状态,特意出了一道签到题给各位dala ...