BootStrap 表单控件之单选按钮水平排列
作者：素颜猪 时间：2024-05-11 09:43:18
1.运行效果如图所示
2.实现代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>表单控件——单选按钮水平排列</title>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet"
href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="external nofollow"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">
<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<link rel="stylesheet"
href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="external nofollow"
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"
crossorigin="anonymous">
</head>
<body>
<form role="form">
<div class="form-group">
<label class="radio-inline">
<input type="radio" value="option1" name="sex">男性
</label>
<label class="radio-inline">
<input type="radio" value="option2" name="sex">女性
</label>
<label class="radio-inline">
<input type="radio" value="option3" name="sex">中性
</label>
</div>
</form>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
</body>
</html>
以上所述是小编给大家介绍的BootStrap 表单控件之单选按钮水平排列网站的支持！
来源：http://suyanzhu.blog.51cto.com/8050189/1927659
标签：bootstrap,表单控件,单选按钮
0
投稿猜你喜欢
Golang中 Slice的分析与使用源码解析
2023-06-19 03:48:13
vue中v-for通过动态绑定class实现触发效果
2024-04-09 10:45:21
Mysql中where与on的区别及何时使用详析
2024-01-21 03:31:19
pyramid配置session的方法教程
2021-04-26 09:23:37
PHP基于迭代实现文件夹复制、删除、查看大小等操作的方法
2023-09-03 22:21:42
Python使用xlrd读取Excel格式文件的方法
2022-12-27 16:54:51
Pytorch Tensor的索引与切片例子
2022-12-08 16:28:10
Java语言实现对MySql数据库中数据的增删改查操作的代码
2024-01-21 21:19:43
一个ASP写的侧边菜单栏
2010-05-27 12:22:00
JS组件Bootstrap Select2使用方法解析
2024-04-16 09:49:36
Python使用树状图实现可视化聚类详解
2021-07-08 13:41:25
golang 字符串切片去重实例
2024-02-20 04:00:53
python 类相关概念理解
2023-02-17 21:16:47
分享20个数据库设计的最佳实践
2024-01-24 09:28:53
Python爬取求职网requests库和BeautifulSoup库使用详解
2021-12-29 09:07:49
利用Java正则表达式校验邮箱与手机号
2023-07-03 15:14:54
Python 生成多行重复数据的方法实现
2022-07-26 18:56:07
MySQL 定时器EVENT学习
2010-10-14 13:55:00
Pytorch如何把Tensor转化成图像可视化
2021-11-03 20:20:22
为什么定位会被float和clear影响！
2008-11-10 11:06:00