背景

通过添加下列类,可以快捷的变换背景颜色,如果是链接的话,鼠标移动上去会变暗

  • bg-primary 被修饰元素将会应到primary类,显示吃淡蓝色,文本颜色会变成白色。
  • bg-success 被修饰元素表示成功的信息,背景变成绿色
  • bg-info 被修饰元素背景颜色会变成淡蓝色
  • bg-warining 被修饰元素表示值得注意的信息,背景颜色变成土黄色
  • bg-danger 被修饰元素表示危险的信息,背景颜色会变成红色

其他

浮动

  • pull-left 元素浮动到左边
  • pull-right 元素浮动到右边

    内容居中

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

    清除浮动

  • clearfix 清除浮动

    显示和隐藏内容

  • show 显示元素(包括屏幕阅读器)
  • hidden 隐藏元素(包括屏幕阅读器)

    屏幕阅读器

  • sr-only 让元素对所有设备隐藏,除了屏幕阅读器
  • sr-only-focusable 在元素获得焦点的时候显示

    样式

  • close 会产生通用的关闭图标
  • caret 显示出通用的下拉框

Bootstrap学习笔记系列7-----Bootstrap简单背景CSS及其他辅助类的更多相关文章

  1. Bootstrap学习笔记系列3-------Bootstrap简单表单显示

    表单布局 垂直或基本表单 基本的表单结构时BootStrap自带的,创建基本表单的步骤如下: 向父<form>元素添加role = "form": 为了获取最佳的间距, ...

  2. Bootstrap学习笔记系列1-------Bootstrap网格系统

    Bootstrap网格系统 学习笔记 [TOC] 简单网格 先上代码再解释 <!DOCTYPE html> <html> <head> <title>B ...

  3. bootstrap学习笔记系列4------bootstrap按钮

    按钮标签 在<a>,<button>或input元素上使用按钮class.但是为了避免跨浏览器的不一致性,建议使用<button>标签. <!DOCTYPE ...

  4. bootstrap学习笔记<一>(bootstrap用法)

    首先引入bootstrap官网链接:http://www.bootcss.com/ bootstrap 3下载地址:http://v3.bootcss.com/getting-started/#dow ...

  5. Bootstrap学习笔记系列2-------Bootstrap简单表格处理

    标签 <table> 为表格添加基础样式 <thead> 表格标题行的容器元素,用来识别列 <tbody> 表格主提中的表格行的容器元素 <tr> 单行 ...

  6. Bootstrap学习笔记系列5------Bootstrap图片显示

    通过添加一下的class来实现bootstrap对图片的支持 img-round 通过border-radius:6px 来获得图片圆角 img-circle 通过border-radius:50%来 ...

  7. Bootstrap学习笔记系列6-----Bootstrap文本显示

    通过对文本或者链接添加下面的类,会使其展示不同的颜色,如果文本是个链接,鼠标移动到文本上,颜色会变暗. text-muted柔和的文本(深色) text-primary 表示基础的文本(蓝色) tex ...

  8. bootstrap学习笔记<八>(bootstrap核心布局风格——栅格系统)

    栅格系统(bootstrap的核心之一,也是bootstrap的主要布局风格) 栅格系统是对原有div布局的升级版.打破了传统div模式只能纵向垂直排列的弊端,大大提高了页面布局的速度和效果,也很好的 ...

  9. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

随机推荐

  1. java提高篇(十一)-----强制类型转换

    在java中强制类型转换分为基本数据类型和引用数据类型两种,这里我们讨论的后者,也就是引用数据类型的强制类型转换. 在Java中由于继承和向上转型,子类可以非常自然地转换成父类,但是父类转换成子类则需 ...

  2. C# 获取当前日期在指定日期范围内是第几周

    public static int GetWeekOfDay(DateTime start, DateTime end) { //总周数 )); //用于存储日期 var weekDic = new ...

  3. 使用hexo+github搭建免费个人博客详细教程

    [TOC] 本文目录(注意无法点击): 前言 体验更加排版请访问原文链接:http://blog.liuxianan.com/build-blog-website-by-hexo-github.htm ...

  4. 浅析SQL Server实现分布式事务的两阶段提交协议2PC

    不久之前团队有个新人问我一个很重要的web服务接口如何保证事务的问题.因为涉及到跨库事务,当时我只是回答目前我们的SOA框架都不支持跨库事务.然后就问到了数据库跨库事务是如何实现的,我只能凭印象含糊回 ...

  5. C++ static

    本文主要记录的C++中static的一些内容,内容简单,仅仅作为梳理一下知识,如有错误请留言指出. static的作用 在函数体,一个被声明为static的变量,在这一函数被调用的过程里,其数值维持不 ...

  6. VS2013 好用的插件

    切换到vs2013上有些时间了,以下是我个人认为比较好的插件. Resharper 神器中的神器,提升编码效率的第一神器,附带提高编码能力:除去臃肿的体积,堪称完美: Productivity Pow ...

  7. Atitit 判断判断一张图片是否包含另一张小图片

    Atitit 判断判断一张图片是否包含另一张小图片 1. keyword1 2.  模板匹配是在图像中寻找目标的方法之一(切割+图像相似度计算)1 3. 匹配效果2 4. 图片相似度的算法(感知哈希算 ...

  8. urldecode解码方法

    输入为带有urldecode转码文本,输出正常文本. //20130625 by zhangyl private string ConvertToString(string input) { inpu ...

  9. Sql Server系列:索引维护

    1. DBCC SHOWCONTIG 显示指定表的数据和索引的碎片信息.当对表进行大量的修改或添加数据后,执行此语句可以查看有无碎片,显示指定的表或试图的数据和索引的碎片信息. 其语法格式: DBCC ...

  10. 深入理解CSS计数器

    × 目录 [1]创建计数器 [2]使用计数器 [3]DEMO 前面的话 我们对计数器已经不陌生了,有序列表中的列表项标志就是计数器. 创建计数器 创建计数器的基础包括两个方面,一是能重置计数器的起点, ...