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里的选项放到后面,问题自然解决! 下面这 ...
随机推荐
- [Xcode 实际操作]八、网络与多线程-(17)使用网址会话对象URLSession向远程服务器上传图片
目录:[Swift]Xcode实际操作 本文将演示如何通过网址会话对象URLSession向远程服务器上传图片. 网址会话对象URLSession具有在后台上传和下载.暂停和恢复网络操作.丰富的代理模 ...
- C 语言实例 - 计算 int, float, double 和 char 字节大小
C 语言实例 - 计算 int, float, double 和 char 字节大小 C 语言实例 C 语言实例 使用 sizeof 操作符计算int, float, double 和 char四种变 ...
- 全球首款iOS模拟器出炉!在违法的边缘疯狂试探
对于许多智能手机用户,特别是手游玩家来说,在手机屏幕的方寸之间进行操作显然并非特别方便,而且在多年之前,由于手机配置不足,也导致了用PC来玩手游的需求不断涌现.彼时,BlueStacks及夜神等一众A ...
- java数据结构----数组篇
1.数组作为java常用的数据结构之一,使用相对简单,下图展示了数组常用操作在允许和不允许重复值的情况下的比较次数 2.进行封装后的代码: package com.cn.higharray; /** ...
- STM32F4之SWO
https://stm32f4-discovery.net/2014/12/library-46-debug-stm32f4-device-swo-feature/
- POJ - 2186 Popular Cows tarjain模板题
http://poj.org/problem?id=2186 首先求出所有的强连通分量,分好块.然后对于每一个强连通分量,都标记下他们的出度.那么只有出度是0 的块才有可能是答案,为什么呢?因为既然你 ...
- 实战:liunx定时清理日志脚本
参考https://blog.csdn.net/qq_39291929/article/details/79054452 1.需求:我们在 /var/log下面有 EmcsYn.log 和 ...
- 公司开发部门GIT与SVN 之争
公司最开始决定是使用GIT作为版本控制 , 也都使用了4,5个月了 , 开发人员也都是20多岁年轻力壮的年轻人 , 每个组的组长也一直在做git使用的培训 , 即使是这样 , 还是遇到了非常大的阻碍 ...
- linux下mysql中文乱码
登录mysql执行mysql> show variables like 'character%';发现编码有些不是utf-8 修改/etc/mysql/my.cnf,网上说的是/etc/my.c ...
- Django之Form组件整理
搬运自:http://www.cnblogs.com/haiyan123/p/7795771.html 一.Form类 创建Form类时,主要涉及到 [字段] 和 [插件],字段用于对用户请求数据的验 ...