<!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>

        <label for="name">默认的复选框和单选按钮的实例</label>

        <div class="checkbox">

            <label><input type="checkbox" value="">选项 1</label>

        </div>

        <div class="checkbox">

            <label><input type="checkbox" value="">选项 2</label>

        </div>

        <div class="radio">

            <label>

                <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked> 选项 1

            </label>

        </div>

        <div class="radio">

            <label>

                <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">选项 2 - 选择它将会取消选择选项 1

            </label>

        </div>

        <label for="name">内联的复选框和单选按钮的实例</label>

        <div>

            <label class="checkbox-inline">

                <input type="checkbox" id="inlineCheckbox1" value="option1"> 选项 1

            </label>

            <label class="checkbox-inline">

                <input type="checkbox" id="inlineCheckbox2" value="option2"> 选项 2

            </label>

            <label class="checkbox-inline">

                <input type="checkbox" id="inlineCheckbox3" value="option3"> 选项 3

            </label>

            <label class="radio-inline">

                <input type="radio" name="optionsRadiosinline" id="optionsRadios3" value="option1" checked> 选项 1

            </label>

            <label class="radio-inline">

                <input type="radio" name="optionsRadiosinline" id="optionsRadios4"  value="option2"> 选项 2

            </label>

        </div>

    </body>

</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：复选框（Checkbox）和单选框（Radio）的更多相关文章

  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 表单：静态控件

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

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：选择框（Select）

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

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：文本框（Textarea）

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

随机推荐

  1. min-25筛总结

    怕忘了赶快更一下.就是求积性函数前缀和的. 没有 \(\LaTeX\) 原理 现在你有一个积性函数 f(1)=1 FP(p) FPK(p,k) 首先要求的是前缀和,那就是f(质数)+f(合数)+f(1 ...

  2. Hadoop学习笔记（三）：分布式文件系统的写和读流程

    写流程:怎么将文件切割成块,上传到服务器 读流程:怎么从不同的服务器来读取数据块 写流程 图一 图二 写的过程中:NameNode会给块分配存储块的位置,每次想要存储文件的时候都会在NameNode创 ...

  3. 「HNOI2012」永无乡

    传送门 Luogu 解题思路 很容易想到平衡树,然后还可以顺便维护一下连通性,但是如何合并两棵平衡树? 我们采用一种类似于启发式合并的思想,将根节点siz较小的那颗平衡树暴力的合并到另一颗上去. 那么 ...

  4. 《JavaScript高级程序设计》读书笔记（三）基本概念第二小节 Number类型

    内容---语法 上一小节---数据类型 本小节 number类型---流程控制语句---理解函数 number类型--使用IEEE754格式来表示整数和浮点数值(双精度数值)--规定了数值字面量格式, ...

  5. 鸡汤 - Choice is yours

    传送门 https://kamranahmed.info/blog/2018/03/24/choice-is-yours/ Our whole lives are driven by the choi ...

  6. HDU3172 Virtual Friends

    基础并查集~ #include<cstdio> #include<algorithm> #include<cstring> #include<unordere ...

  7. linux--网络管理-ifconfig,route,netstat,ip,ss,dns,主机名网卡名修改bond

    cat /etc/services 查看常见端口对应的服务 查一查某个端口号,是哪个进程在用  lsof  -i :6010 49152-65535:动态端口或私有端口,客户端程序随机使用的端口  其 ...

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

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

  9. 在一个不稳定的无效的ViewState净的应用问题。 Erratic Invalid Viewstate issue in a .NET application

    这似乎是很多人都经历了同样的IE8的问题.似乎发生的是,不知何故,IE8(在IE8的渲染模式和IE7兼容模式)将失去4096个字节的HTML文档中该数据缺失导致此异常(通常你看到这一scriptres ...

  10. push 、pop 、unshift 、shift

    push .pop : 操作数组后面 unshift .shift :操作数组前面 push.unshift : 字母多的添加 pop .shift : 字母少的删除 push.unshift : 添 ...