Bootstrap框架中checkbox和radio有点特殊,Bootstrap针对他们做了一些特殊化处理,主要是checkbox和radio与label标签配合使用会出现一些小问题(最头痛的是对齐问题)。使用Bootstrap框架,开发人员无需考虑太多。

<form role="form">
<h3>案例1</h3>
<div class="checkbox">
<label>
<input type="checkbox" value="">
记住密码
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="love" checked>
喜欢
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios2" value="hate">
不喜欢
</label>
</div> </form>

Bootstrap系列 -- 17. 复选框checkbox和单选择按钮radio的更多相关文章

  1. 关于bootstrap--表单(下拉<select>、输入框<input>、文本域<textare>复选框<checkbox>和单选按钮<radio>)

    html 里面的 role 本质上是增强语义性,当现有的HTML标签不能充分表达语义性的时候,就可以借助role来说明.通常这种情况出现在一些自定义的组件上,这样可增强组件的可访问性.可用性和可交互性 ...

  2. jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等

    转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...

  3. 纯CSS3来自定义单选框radio与复选框checkbox

    单选框(radio)自定义样式 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 3 ...

  4. css3美化复选框checkbox

     两种美化效果如下图: 代码(html) <div id="main"> <h2 class="top_title">使用CSS3美化复 ...

  5. [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果

    图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...

  6. 复选框(checkbox)、单选框(radiobox)的使用

    复选框(checkbox).单选框(radiobox)的使用 复选框: HTML: // 复选框 <input type="checkbox" name="chec ...

  7. php 判断复选框checkbox是否被选中

    php 判断复选框checkbox是否被选中   复选框checkbox在php表单提交中经常被使用到,本文章通过实例向大家介绍php如何判断复选框checkbox中的值是否被选中,需要的朋友可以参考 ...

  8. jquery判断复选框checkbox是否被选中

    jquery判断复选框checkbox是否被选中 使用is方法 //如果选中返回true //如果未选中返回false .is(':checked');

  9. 3.Android之单选按钮RadioGroup和复选框Checkbox学习

    单选按钮和复选框在实际中经常看到,今天就简单梳理下. 首先,我们在工具中拖进单选按钮RadioGroup和复选框Checkbox,如图: xml对应的源码: <?xml version=&quo ...

随机推荐

  1. wampserver安装之后连接phpMyAdmin 不成功的解决方法

    情况:我原先安装了本地的mysql数据库,默认密码不是为空,而是123456,但是wampserver安装默认mysql的密码是为空的.所以需要修改一下默认的配置.不然会出现连不上数据库. 解决方案: ...

  2. stm32时钟分析

    转载自http://blog.chinaunix.net/uid-21658993-id-3129667.html   在STM32中,有五个时钟源,为HSI.HSE.LSI.LSE.PLL. 其实是 ...

  3. builder.properties

    请加上这句话: javacDefaultEncoding.. = UTF-8

  4. 【Octave】柱面投影简析

    ========================我是分割线========================== 在做全景拼接的时候,为了保持图片中的空间约束与视觉的一致性,需要做一定的预处理,可以是球 ...

  5. Zbrush 4R7 P3中各类模型怎么快速隐藏

    在ZBrush®软件中除了遮罩功能可以对模型局部进行编辑外,我们还可以通过显示和隐藏来对模型的局部进行控制. 查看更多内容请直接前往:http://www.zbrushcn.com/jichu/xia ...

  6. c查漏补缺

    restrict 要理解什么是restrict,首先要知道Pointer aliasing:指两个或以上的指针指向同一数据,例如: ; int *a = &i; int *b = &i ...

  7. [3D跑酷] GUIManager UI管理

    UI元素更新及界面跳转 继上篇日志<Unity开发之 GUIClickEventReceiver>,再谈一下我们如何管理游戏中的UI元素更新及界面跳转 UI绑定 图一:Inspector面 ...

  8. 024医疗项目-模块二:药品目录的导入导出-HSSF导入类的学习

    我们之前学习了怎么把数据的数据导出来保存到Excle中,这篇文章我们学习怎么Excel数据导出然后插入到数据库中. 我们先学习HSSF怎么用来导出数据. 看官方教程步骤如下: 第一步: 创建一个wor ...

  9. Linux 进程与线程三(线程比较--创建线程参数)

    int pthread_equal(pthread_t th1,pthread_t th2); pthread_equal函数比较th1与th2是否为同一线程,由于不可以讲pthread_t数据类型认 ...

  10. 小程序基础09:视图层之WXML

    1.WXML WXML是框架设计的一套标签语言,结合基础组件,事件系统,可以构建出页面的结构. 用以下的例子来看看WXML有什么能力: 1.1数据绑定 <view>{{age}}</ ...