类 	                    描述

.pull-left 	元素浮动到左边

.pull-right 	元素浮动到右边

.center-block 	设置元素为 display:block 并居中显示

.clearfix 	清除浮动

.show 	强制元素显示

.hidden 	强制元素隐藏

.sr-only 	除了屏幕阅读器外，其他设备上隐藏元素

.sr-only-focusable 	与 .sr-only 类结合使用，在元素获取焦点时显示(如：键盘操作的用户)

.text-hide 	将页面元素所包含的文本内容替换为背景图

.close 	显示关闭按钮

.caret 	显示下拉式功能

下拉列表

<body>

    <div class="container">

      <h2>实例</h2>

      <p> .caret 类显示了一个下拉的功能: <span class="caret"></span></p>

      <p> .caret 类在按钮中使用：</p>

      <div class="btn-group">

        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Menu <span class="caret"></span></button>

        <ul class="dropdown-menu" role="menu">

          <li><a href="#">一个链接</a></li>

          <li><a href="#">另一个链接 link</a></li>

          <li><a href="#">其他功能</a></li>

        </ul>

      </div>

    </div>

    <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

    <script src="http://apps.bdimg.com/libs/bootstrap/3.3.0/js/bootstrap.min.js"></script>

  </body>

清除浮动

<div class="clearfix"  style="background: #D8D8D8;border: 1px solid #000;padding: 10px;">

   <div class="pull-left" style="background:#58D3F7;">

      向左快速浮动

   </div>

   <div class="pull-right" style="background: #DA81F5;">

      向右快速浮动

   </div>

</div>

bootstrap之辅助类的更多相关文章

  1. Bootstrap内辅助类，响应式工具，组件的个人总结

    辅助类(工具类): 文本颜色: <p class="text-muted">Fusce dapibus, tellus ac cursus commodo, torto ...

  2. bootstrap -- css -- 辅助类

    文本 文本颜色 如果文本是个链接,则鼠标移动到链接文本上的时候,文本会变暗 .text-muted:灰色 .text-primary:浅蓝色 .text-success:绿色 .text-info:深 ...

  3. Tomcat8源码笔记(二)Bootstrap启动

    TOMCAT源码调试入口是Bootstrap类的main方法,我的启动参数VM: -Dcatalina.home=E:/Tomcat_Source_Code/apache-tomcat-8.0.53- ...

  4. 【Netty】Netty简介及服务器客户端简单开发流程

    什么是Netty Netty是一个基于Java NIO的编写客服端服务器的框架,是一个异步事件框架. 官网https://netty.io/ 为什么选择Netty 由于JAVA NIO编写服务器的过程 ...

  5. Bootstrap<基础九>辅助类

    Bootstrap 中的一些可能会派上用场的辅助类. 文本 以下不同的类展示了不同的文本颜色.如果文本是个链接鼠标移动到文本上会变暗: 类 描述   .text-muted "text-mu ...

  6. Bootstrap辅助类

    前面的话 Bootstrap提供了一组工具类,用于辅助项目的开发.本文将详细介绍Bootstrap辅助类 文本色 通过颜色来展示意图,Bootstrap 提供了一组工具类.这些类可以应用于链接,并且在 ...

  7. bootstrap——辅助类和响应式工具类

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. Bootstrap 辅助类

    [Bootstrap 辅助类] 1.背景色 2. <p>插入符实例 <span class="caret"></span> </p> ...

  9. Bootstrap 按钮，图片，辅助类

    Bootstrap 按钮 任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: 以下样式可用于<a&g ...

随机推荐

  1. vsftp移植（待续）

    1. 下载sftp包,解压.如vsftpd-2.3.5.tar.gz2. 编译 进入目录后,修改交叉编译工具(vi Makefile) CC      = arm-none-linux-gnueabi ...

  2. 快速上手最棒的网格框架ag-Grid

    由于对aggrid由衷的感谢, 又忍不住写了一篇软文来推广它(其实主要是为了弥补我把enterprise版扣下来后内心的愧疚...) ag-Grid是速度最快,功能最丰富的JavaScript dat ...

  3. DataGridView使用技巧八：设置单元格的ToolTip

    ToolTip属性用来设置当鼠标移动到单元格上面时的提示内容. DataGridView.ShowCellToolTips=True的情况下,单元格的ToolTip可以表示出来.对于单元格窄小,无法完 ...

  4. FFmpeg API变化

    可以查看doc目录下的APIchanges和根目录下的Changelog 去掉了ffserver程序   'avcodec_register_all' is deprecated 还有av_regis ...

  5. js学习笔记12----json数据格式，语法，遍历

    1.json数据格式:var json={} 示例一: var user = {'name':'sese','age':'24','sex':'女'} console.log(user.age); / ...

  6. EasyUi---searchbox 条件查询

    前台UI参考代码: <script type="text/javascript" charset="utf-8"> $(function(){ /* ...

  7. 12款优秀jQuery Ajax分页插件和教程

    在这篇文章中,我为大家收集了12个基于 jQuery 框架的 Ajax 分页插件,这些插件都提供了详细的使用教程和演示.Ajax 技术的出现使得 Web 项目的用户体验有了极大的提高,如今借助优秀的 ...

  8. C语言 字面量

    在计算机科学中,字面量(literal)是用于表达源代码中一个固定值的表示法(notation). 几乎所有计算机编程语言都具有对基本值的字面量表示,诸如:整数.浮点数以及字符串: 而有很多也对布尔类 ...

  9. 关于Cocos2d-x事件处理机制

    事件处理步骤: 1.创建一个触摸事件监听器(单点触摸或多点触摸) 2.实现触摸事件的响应方法 3.添加事件监听器(场景优先或固定值优先) 4.当用户触摸时,事件分发器就会将事件分发给监听器进行响应 首 ...

  10. nodejs基础 -- 事件循环

    Node.js 事件循环 Node.js 是单进程单线程应用程序,但是通过事件和回调支持并发,所以性能非常高. Node.js 的每一个 API 都是异步的,并作为一个独立线程运行,使用异步函数调用, ...