zoukankan      html  css  js  c++  java
  • 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>

  • 相关阅读:
    WPF 中的简单的动画
    C#获取本地IP地址
    SqlLite公用类
    关键帧动画概述
    使用checked关键字处理“溢出”错误
    WPF 静态属性的使用
    将数字转换成汉语
    监控视频的测试
    WPF Visibility的用法
    WPF 设计器程序集
  • 原文地址:https://www.cnblogs.com/melao2006/p/4987646.html
Copyright © 2011-2022 走看看