zoukankan      html  css  js  c++  java
  • bootstrap 使用(三)

    组件

    1、Glyphicons
    使用

    <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
    <button type="button" class="btn btn-default" aria-label="Left Align">
      <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span>
    </button>
    

    图标类不能和其它组件直接联合使用。它们不能在同一个元素上与其他类共同存在。应该创建一个嵌套的 标签,并将图标类应用到这个 标签上。
    图标类只能应用在不包含任何文本内容或子元素的元素上。
    2、下拉菜单
    将下拉菜单触发器和下拉菜单都包裹在 .dropdown 里,或者另一个声明了 position: relative; 的元素

    <div class="dropdown">
      <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        Dropdown
        <span class="caret"></span>
      </button>
      <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
        <li><a href="#">Action</a></li>
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
        <li role="separator" class="divider"></li>
        <li><a href="#">Separated link</a></li>
      </ul>
    </div>
    

    (1)弹出方式
    div.dropdown向下弹出
    div.dropup向上弹出
    3、按钮组
    4、按钮式下拉菜单
    5、输入框组
    6、导航
    7、导航条
    8、路径导航
    9、分页
    10、标签
    11、徽章

    媒体对象:默认样式的媒体对象组件允许在一个内容块的左边或右边展示一个多媒体内容(图像、视频、音频)。

  • 相关阅读:
    机器人学——1.6-双向量表示法
    机器人学——1.5-奇异点及万向节锁
    机器人学——1.4-三角度表示法
    机器人学——1.3-正交旋转矩阵
    MySQL数据库操作
    ArrayList和LinkedList的区别
    redis 常用命令
    idea快捷键
    Spring
    JDBC
  • 原文地址:https://www.cnblogs.com/heibaimao123/p/13815555.html
Copyright © 2011-2022 走看看