辅助样式

1、情景文本色  .text-muted  .text-primary  .text-success  .text-info  .text-warning  .text-danger  {color}

2、情景背景色  .bg-primary  .bg-success  .bg-info  .bg-warning  .bg-danger  {color/background-color}

3、关闭按钮  .close  ×  {padding/cursor/background/border/float/font-size/font-weight/color/opcity}

4、三角符号  .caret  {display/width/height/border-top/border-left/border-right}

5、快速浮动  .pull-left  .pull-right  {float!important}

6、居中  .center-block  {display/margin-left/margin-right}

7、清除浮动  .clearfix

8、显示和隐藏  .show  .hidden  .invisible

9、屏幕阅读器和键盘导航  .sr-only  .sr-only-focusable  {position/width/height/padding/margin/overflow/clip/border}

10、文本隐藏,图片替换  .text-hide  {font/color/background-color/text-shadow/border}

11、响应式显示和隐藏类

超小<768        小>768        中等>992        大>1200

.visible-xs-*        可见            隐藏           隐藏           隐藏

.visible-sm-*       隐藏            可见           隐藏           隐藏

.visible-md-*       隐藏           隐藏           可见           隐藏

.visible-lg-*        隐藏            隐藏           隐藏           可见

.hidden-sm        可见            隐藏           可见           可见

.hidden-md        可见            可见           隐藏           可见

.hidden-lg         可见            可见           可见           隐藏

.visible-**-*  :  .visible-**-block  .visible-**-inline-block  .visible-**-inline

[Bootstrap]全局样式(五)的更多相关文章

  1. bootstrap 全局样式设置

    HTML <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" co ...

  2. bootstrap全局样式二

    加form-grope是为了以后更好的管理,一组form写一个form-grope 显示如下: 并排显示的话,给用户名前面再加一个div,再加horizontal,如下,并且加上control-lab ...

  3. bootstrap全局样式

    内联子标题: 显示如下: 主体副本: 显示如下: 对齐类: 显示如下: 强调类: 显示如下: 缩略语: 地址: 表格: 加一个class:“table-striped” js里面的奇数偶数行(odd) ...

  4. [Bootstrap]全局样式(四)

    按钮 1.基本类.btn {display/padding/margin-bottom/font-size/border-radius/border} 作用于< a:role:button &g ...

  5. [Bootstrap]全局样式(三)

    表格 1.基本类  .table  {width/margin-bottom/}  {padding/border-top} e.g.:<table class="table" ...

  6. [Bootstrap]全局样式(二)

    具体排版 1.标题和标题类 <h1> ~<h6>和.h1~h6|副标题<small>和.small font-size                    mar ...

  7. [Bootstrap]全局样式(一)

    页面必须设置为html5文档类型 <!DOCTYPE html> <html lang="zh-CN"> ... </html> 适应移动设备 ...

  8. bootstrap 全局样式

    reset.css html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% ...

  9. bootstrap全局CSS样式学习

    参考http://v3.bootcss.com/css/,根据自己的记忆进行的复述,加深记忆. 首先介绍bootstrap全局CSS样式 只通过使用bootstrap.css,即可获得统一的样式设置. ...

随机推荐

  1. 微信公众平台Token验证失败的解决办法

    微信公众平台Token验证失败的解决办法 1.可查看url和token是否正确 2.查看服务器端口是否为80端口 3.你可以通过记录log日志来判断是否接受到微信提交过来的信息 1.$fp=fopen ...

  2. Educational Codeforces Round 2 A. Extract Numbers 模拟题

    A. Extract Numbers Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/600/pr ...

  3. cdoj 574 High-level ancients dfs序+线段树

    High-level ancients Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/s ...

  4. POJ 2406 Power Strings KMP运用题解

    本题是计算一个字符串能完整分成多少一模一样的子字符串. 原来是使用KMP的next数组计算出来的,一直都认为是能够利用next数组的.可是自己想了非常久没能这么简洁地总结出来,也仅仅能查查他人代码才恍 ...

  5. delphi 动态建立WebBrower

    //Delphi动态建立WebBrowerunit Main;interfaceuses  Windows, Messages, SysUtils, Variants, Classes, Graphi ...

  6. [Ramda] Compose and Curry

    Curry: The idea of Curry is to spreate the data from the function. Using Curry to define the functio ...

  7. windows 下的命令行工具。。

    1.powershell window自带..右下角搜索..powershell 2.conemu https://code.google.com/p/conemu-maximus5/wiki/Dow ...

  8. const int * pi/int * const pi的区别

    前面有一篇文章:数组名就是常量指针 参考文章:http://blog.pfan.cn/whyhappy/5164.html const int * pi .int const * pi与int *   ...

  9. 使用c3p0连接池

    首先我们需要知道为什么要使用连接池:因为jdbc没有保持连接的能力,一旦超过一定时间没有使用(大约几百毫秒),连接就会被自动释放掉,每次新建连接都需要140毫秒左右的时间而C3P0连接池会池化连接,随 ...

  10. Python 2.x and 3.x String VS Bytes

    In Python 3 unicode strings are the 'regular strings' (str) and byte strings are separate objects. L ...