`

Bootstrap单选按钮

阅读更多
radio-finish.html 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>单选按钮</title>
<link href="../bootstrap/css/bootstrap.css" rel="stylesheet">
<!--[if lt IE 9]>
      <script src="../bootstrap/js/html5.js"></script>
<![endif]-->
</head>

<body>
<div class="container">
  <h1 class="page-header">单选按钮</h1>
  <label>您的性别</label>
  <label class="radio"><input type="radio" name="gender" value="male">男</label>
  <label class="radio"><input type="radio" name="gender" value="female">女</label>
  <label class="radio"><input type="radio" name="gender" value="other">其他</label>
</div>
<script src="../bootstrap/js/jquery-1.7.2.min.js"></script> 
<script src="../bootstrap/js/bootstrap.js"></script>
</body>
</html>
分享到：
| Bootstrap文本框的前缀与后缀
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Bootstrap单选按钮和复选框美化特效.zip

    在本资源"Bootstrap单选按钮和复选框美化特效.zip"中，我们关注的是如何利用Font Awesome这个流行图标库来增强Bootstrap的默认表单元素——单选按钮（radio buttons）和复选框（checkboxes）的视觉效果。 Font ...

    Bootstrap单选按钮和复选框美化特效

    在Bootstrap中，单选按钮（radio buttons）和复选框（checkboxes）是常见的表单元素，用于收集用户的选择信息。然而，Bootstrap默认的样式相对朴素，有时可能无法满足设计上的需求。为了提升用户体验和视觉效果，...

    基于bootstrap图标形状单选按钮radio

    基于bootstrap的单选按钮图标 改变了浏览器自带形状，支持自定义图标

    Bootstrap单选按钮和复选框美化特效特效代码

    在Bootstrap中，单选按钮（radio buttons）和复选框（checkboxes）是用户界面中常见的交互元素，用于收集用户的选择信息。然而，Bootstrap的默认样式可能相对朴素，有时需要进行个性化美化以提升用户体验。 本资源...

    Bootstrap复选框和单选按钮美化插件

    在Bootstrap中，复选框（checkboxes）和单选按钮（radio buttons）是用户界面中常见的交互元素，用于收集用户的选择。然而，Bootstrap默认的样式可能相对朴素，不能满足所有设计需求。这就是为什么开发者经常寻求第...

    bootstrap TreeView全选单选，定位选触发事件实例

    在Bootstrap TreeView中，全选功能通常通过一个按钮或复选框实现，当用户点击全选按钮时，所有树节点都将被选中。单选则是每次只能选择一个节点，选择其他节点时，先前选中的节点将自动取消选择。这通常涉及到...

    BootStrapTable 单选及取值的实现方法

    这将在每一行的前面添加一个复选框，但因为设置了 `singleSelect`，它将作为单选按钮。 ```javascript columns: [ { checkbox: true }, // 其他列定义... ] ``` 2. **获取选中值：** 要获取选中的行数据，...

    纯CSS Bootstrap单选框和复选框美化特效

    icheck-bootstrap是一款纯CSS Bootstrap单选框和复选框美化特效插件。通过该插件，你可以对原生的bootstrap单选框和复选框进行美化，应用不同的主题样式，甚至可以制作扁平风格的单选框和复选框。

    BootstrapSwitch将复选框和单选按钮变成切换开关

    BootstrapSwitch是一款基于Bootstrap框架的插件，它能够将HTML中的复选框（checkbox）和单选按钮（radio button）转化为视觉效果更佳、交互性更强的切换开关（toggle switch）。这个转换过程使得用户界面更加直观，...

    unigui Bootstrap按钮分组

    4. **分组行为**：Bootstrap按钮分组支持两种基本行为：单选和多选。对于单选，你可以使用`.btn-group-toggle`和`.btn-check`类，配合`&lt;input type="radio"&gt;`来实现。多选则使用`.btn-group-checkbox`和`.btn-check`...

    BootStrap 表单控件之单选按钮水平排列

    在Bootstrap中，表单控件是构建用户界面的重要部分，而单选按钮则是表单中常见的一种选择输入方式。在本教程中，我们将深入探讨如何使用Bootstrap来实现单选按钮的水平排列。 在传统的HTML表单中，单选按钮通常垂直...

    Bootstrap CSS组件之按钮下拉菜单

    在Bootstrap框架中，按钮下拉菜单（Button Dropdowns）是一种常用的交互组件，它允许用户在一个按钮内嵌入下拉列表，提供多种操作选项。这种设计既节省空间，又增加了用户体验的便捷性。本文将深入探讨Bootstrap按钮...

    一款不错的单选按钮样式

    标题中的“一款不错的单选按钮样式”提示我们，这篇内容可能涉及前端开发，特别是关于用户界面（UI）设计中的单选按钮美化或自定义。单选按钮是网页表单中常见的交互元素，允许用户在一组互斥选项中选择一个。 在...

    单选按钮插件

    当单选按钮插件与Bootstrap集成时，可以充分利用Bootstrap的网格系统、CSS样式以及JavaScript插件，以实现更为一致且易于使用的UI设计。 单选按钮插件如iCheck，是用于美化和增强HTML原生单选按钮的库。iCheck提供...

    bootstrap-multiselect下拉框多选单选条件筛选

    Bootstrap Multiselect是一款基于Bootstrap框架的插件，用于创建具有多选和单选功能的下拉框，同时提供了条件筛选的功能。这款插件极大地提升了用户在交互界面中的选择体验，尤其适用于需要用户从大量选项中进行选择...

    按钮单选示例demo

    通过设置相同的`name`属性，可以确保同一组中的单选按钮互斥，即一次只能选择一个。 2. **状态管理**：为了跟踪用户的选中状态，我们需要一个变量来保存当前选中的按钮。这可以通过在JavaScript中定义变量或者使用...

Magicbox
Global site tag (gtag.js) - Google Analytics