Bootstrap select(选择列表)
当您想让用户从多个选项中进行选择,但是默认情况下只能选择一个选项,则使用选择框
1、使用<select>展示列表选项
2、使用multiple="multiple"允许用户选择多个选项
实例:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例:Select选择框</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<form role="form">
<div class="form-group">
<label>单选择列表</label>
<select class="form-control">
<optgroup label="fruits">
<option>Apple</option>
<option>Orange</option>
<option>Pear</option>
<option>Grade</option>
<option>Leman</option>
<option>Magao</option>
</optgroup>
<optgroup label="cars">
<option>路虎</option>
<option>奔驰</option>
<option>宝马</option>
<option>大众</option>
<option>起亚</option>
<option>现代</option>
</optgroup>
</select>
<br />
<label>多选择列表</label>
<select class="form-control" multiple="multiple">
<optgroup label="fruits">
<option>Apple</option>
<option>Orange</option>
<option>Pear</option>
<option>Grade</option>
<option>Leman</option>
<option>Magao</option>
</optgroup>
<optgroup label="cars">
<option>路虎</option>
<option>奔驰</option>
<option>宝马</option>
<option>大众</option>
<option>起亚</option>
<option>现代</option>
</optgroup>
</select>
</div>
</form>
</div>
<script src="Css/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>
Bootstrap select(选择列表)的更多相关文章
- select 选择列表传值问题
<select> <option value ="volvo">Volvo</option> <option value ="s ...
- 【MySQL作业】SELECT 数据查询——美和易思select 选择列表应用习题
点击打开所使用到的数据库>>> 1.查询所有客户的地址和电话号码. SELECT address, phone FROM customer 2.查询所有商品的名称.种类和单价信息. ...
- 选择列表中的列无效,因为该列没有包含在聚合函数或 GROUP BY 子句中
选择列表中的列无效,因为该列没有包含在聚合函数或 GROUP BY 子句中 T-SQL核心语句形式: SELECT --指定要选择的列或行及其限定 [INTO ] --INTO子句 ...
- bootstrap select 多选的用法,取值和赋值(取消默认选择第一个的对勾)
h5自带的select标签可以实现按住ctrl键多选的功能,但是样式及其难看. bootstrap select是很好用的前端插件 首先引入bootstrap和bootstrap-select的c ...
- 当没有用 EXISTS 引入子查询时,在选择列表中只能指定一个表达式。
当没有用 EXISTS 引入子查询时,在选择列表中只能指定一个表达式.比如 select * from T_Employee where FNumber not in ( select top 5* ...
- 类似 select 选择框效果及美化
网上有各种各样的关于 select 选择框的美化,找了很多,并没有好的样式效果.所以就找了一个利用 ul li 做的类似 select 选择框的效果,不废话了,先上图,效果如下: 对于上图的箭头效果, ...
- Bootstrap-风格的下拉按框:Bootstrap Select
Bootstrap Select 是一个jQuery插件,提供了Bootstrap 风格的下拉选择框.拥有许多自定义的选项,可多选. 效果图: 源代码: <select class=" ...
- 智能文件选择列表—— bat 批处理
智能文件选择列表 *.wim @echo off setlocal enabledelayedexpansion title 智能文件选择列表 pushd %~dp0 & cd /d %~dp ...
- 在选择列表中无效,因为该列既不包含在聚合函数中,也不包含在 GROUP BY 子句
在选择列表中无效,因为该列既不包含在聚合函数中,也不包含在 GROUP BY 子句 突然看到这个问题,脑袋一蒙,不知道啥意思,后来想想,试图把select里的选项放到后面,问题自然解决! 下面这 ...
随机推荐
- CodeForces 363D 【二分+贪心】
思路: 一开始是没有办法贪心的,但是答案是可以二分的,因为窝能买k辆车的话,窝就一定能买k-1辆车:而且我最好就是拿手上钱较多的那些人去买价格便宜的车,这样肯定是能买到最多的车,而且花的少,因为对于要 ...
- hdu 4694 Important Sisters【支配树】
求出支配树输出到father的和即可 支配树见:https://blog.csdn.net/a710128/article/details/49913553 #include<iostream& ...
- uoj#266. 【清华集训2016】Alice和Bob又在玩游戏(博弈论)
传送门 完了我连sg函数是个啥都快忘了 设\(sg[u]\)为以\(u\)为根节点的子树的\(sg\)函数值,\(rem[u]\)表示\(u\)到根节点的路径删掉之后剩下的游戏的异或值 根节点\(u\ ...
- Libre OJ P2332「JOI 2017 Final」焚风现象【差分思想】By cellur925
题目传送门 这道题开始看起来会很晕...\(qwq\).首先我们要明确题目中的海拔&&温度.温度是受海拔影响的,每次改变的是海拔,我们求的是温度. 我们开始读入的时候便可以处理出开始\ ...
- 构建使用SQL服务器的ASP.net Core2.0 API
web api的教程非常少,使用 core2.0的更少,微软提供了一个aspnet core2的教程,也提供了EF core中访问SQL服务器的教程,参考这些教程可以做出使用sql server的as ...
- ZK的选举算法
一.前言 前面学习了Zookeeper服务端的相关细节,其中对于集群启动而言,很重要的一部分就是Leader选举,接着就开始深入学习Leader选举. 二.Leader选举 2.1 Leader选举概 ...
- Unrecogized font family ‘Ionicons’ 在ios上报错,android正常
解决方法: react-native link react-native-vector-icons 很多模块都需要link一下
- python连接mysql时连接不到test文件夹怎么办
最新版mysql安装后默认是没有test文件夹的,这时候需要我们自己创建一个test文件夹, 文件默认路径如下 C:\ProgramData\MySQL\MySQL Server 5.7\Dat ...
- [ZPG TEST 114] 括号匹配【树分治 点分治 括号序列】
1. 括号匹配 有一棵树,每个节点上都有一个括号(左括号或者右括号).有多少个有序点对(u, v)从u到v的路径上的节点构成的字符串是一个合法的括号匹配?(我们称这样的点对是合法的) 输 ...
- Codeforces Round #497 (Div. 2)B. Turn the Rectangles
Bryce1010模板 http://codeforces.com/contest/1008/problems #include <bits/stdc++.h> using namespa ...