Bootstarp相关类

.container 类用于固定宽度并支持响应式布局的容器。

.container-fluid 类用于 100% 宽度,占据全部视口(viewport)的容器。

/* 超小屏幕(手机,小于 768px) */
@media (max-width: @screen-xs-max) { ... }

/* 小屏幕(平板,大于等于 768px) */
@media (min-width: @screen-sm-min) { ... }

/* 中等屏幕(桌面显示器,大于等于 992px) */
@media (min-width: @screen-md-min) { ... }

/* 大屏幕(大桌面显示器,大于等于 1200px) */
@media (min-width: @screen-lg-min) { ... }

使用 .col-md-offset-* 类可以将列向右侧偏移。这些类实际是通过使用 * 选择器为当前元素增加了左侧的边距(margin)。例如,.col-md-offset-4 类将 .col-md-4 元素向右侧偏移了4个列(column)的宽度。

通过使用 .col-md-push-* 和 .col-md-pull-* 类就可以很容易的改变列(column)的顺序。

h1. 36px
h2. 30px
h3. 24px
h4. 18px
h5. 14px
h6. 12px

Bootstrap 将全局 font-size 设置为 14px,line-height 设置为 1.428(即20px)。这些属性直接赋予 <body> 元素和所有段落元素。另外,<p> (段落)元素还被设置了等于 1/2 行高(即 10px)的底部外边距(margin)。

p中通过添加 .lead 类可以让段落突出显示。

对于被删除的文本使用 <del> 标签。

内联文本元素<mark>标签。

对于没用的文本使用 <s> 标签。

额外插入的文本使用 <ins> 标签。

为文本添加下划线,使用 <u> 标签。

使用 <small> 标签包裹,其内的文本将被设置为父容器字体大小的 85%。

strong-----粗体
em------斜体

<b> 用于高亮单词或短语,不带有任何着重的意味;
<i> 标签主要用于发言、技术词汇等。

text-lowercase----大写转小写
text-uppercase----小写转大写
text-capitalize----首字母小写转大写

list-unstyled------无样式列表
list-inline--------将所有元素放置于同一行

.dl-horizontal 可以让 <dl> 内的短语及其描述排在一行(dt中的内容与dd中的内容在一行显示)

&lt;-------<
&gt;-------/>
通过 <code> 标签包裹内联样式的代码片段
通过 <kbd> 标签标记用户通过键盘输入的内容。
多行代码可以使用 <pre> 标签。为了正确的展示代码,注意将尖括号做转义处理。
pre可使用 .pre-scrollable 类,其作用是设置 max-height 为 350px ,并在垂直方向展示滚动条。

通过 <var> 标签标记变量。
通过 <samp> 标签来标记程序输出的内容。

为任意 <table> 标签添加 .table 类可以为其赋予基本的样式 — 少量的内补(padding)和水平方向的分隔线
.table-striped 类可以给 <tbody> 之内的每一行增加斑马条纹样式。
.table-hover 类可以让 <tbody> 中的每一行对鼠标悬停状态作出响应。
.table-bordered 类为表格和其中的每个单元格增加边框。
.table-condensed 类可以让表格更加紧凑,单元格中的内补(padding)均会减半。

通过这些状态类可以为行或单元格设置颜色。

.active ----鼠标悬停在行或单元格上时所设置的颜色

.success ----标识成功或积极的动作

.info -------标识普通的提示信息或动作

.warning ------标识警告或需要用户注意

.danger --------标识危险或潜在的带来负面影响的动作

时间: 2024-10-10 16:17:17

Bootstarp相关类的相关文章

Bayes++ Library入门学习之熟悉UKF相关类

UKF-SLAM是一种比较流行SLAM方案.相比EKF-SLAM,UKF利用unscented transform代替了EKF的线性化趋近,因而具有更高的精度.Bayes++库中的unsFlt.hpp中给出了UKF实现的相关类. namespace Bayesian_filter 39 { 40 41 class Unscented_predict_model : public Predict_model_base 42 /* Specific Unscented prediction mode

【Anroid】第9章 列表视图(1)--ListView相关类及其适配器

分类:C#.Android.VS2015: 创建日期:2016-02-18 一.简介 列表视图(ListView)是Android应用程序中使用最频繁的UI组件,从无处不在短菜单选项列表到冗长的联系人或internet收藏夹列表--都会用它来实现. ListView控件的用法非常灵活,既可以使用内置的视图呈现基本的样式,也可以用自定义视图呈现各种特殊的视觉效果. 要完全掌握Android提供的ListView控件的用法,需要解决下面的问题: (1)如何用Android内置的视图呈现列表视图中的每

Web---演示Servlet的相关类、下载技术、线程问题、自定义404页面

Servlet的其他相关类: ServletConfig – 代表Servlet的初始化配置参数. ServletContext – 代表整个Web项目. ServletRequest – 代表用户的请求. ServletResponse – 代表用户的响应. HttpSession – 代表用户的一次会话. 本篇博客演示:ServletConfig类 和 ServletContext 类(网页点击量统计,留言板和图片下载技术(其他类型文件类似)) ServletConfig: 它包含了Serv

List 接口以及实现类和相关类源码分析

List 接口以及实现类和相关类源码分析 List接口分析 接口描述 用户可以对列表进行随机的读取(get),插入(add),删除(remove),修改(set),也可批量增加(addAll),删除(removeAll,retainAll),获取(subList). 还有一些判定操作:包含(contains[All]),相等(equals),索引(indexOf,lastIndexOf),大小(size). 还有获取元素类型数组的操作:toArray() 注意事项 两种迭代器Iterator和L

hive的shims相关类分析

在hive的源码中经常可以看到shims相关的类,shims相关类是用来兼容不同的hadoop和hive版本的,以HadoopShims为例org.apache.hadoop.hive.shims.HadoopShims是一个接口,具体的实现类为 org.apache.hadoop.hive.shims.Hadoop20Shims org.apache.hadoop.hive.shims.Hadoop20SShims org.apache.hadoop.hive.shims.Hadoop23Sh

Android 网络编程 API笔记 - java.net 包 权限 地址 套接字 相关类 简介

Android 网络编程相关的包 : 9 包, 20 接口, 103 类, 6 枚举, 14异常; -- Java包 : java.net 包 (6接口, 34类, 2枚举, 12异常); -- Android包 : android.net 包 (1接口, 19类, 3枚举, 1异常), android.net.http 包 (6类), android.net.nsd 包 (3接口, 2类), android.net.rtp (4类), android.net.sip 包 (1接口, 9类, 1

ajax相关类web前端面试题

ajax相关类 1. ajax的跨域问题和缓存原理? 答: 推荐:ajax处理跨域有几种方式?实现原理是什么? 推荐:ajax缓存原理 2. 同步与异步的区别? 答: 1. 同步请求:顺序处理,即当我们向服务器发出一个请求时,在服务器没返回结果给客户端之前,我们要一直处于等待状态直至服务器将结果返回到客户端,我们才能执行下一步操作. 2. 异步请求:并行处理,当我们向服务器发出一个请求时,在服务器没返回结果之前,我们还是可以执行其他操作. 3. ajax属于javascript? 答:javas

RecipientEditTextView相关类

概述 RecipientEditTextView是Android原生短信和电子邮件中用到的控件,代码位于frameworks/opt/chips(mtk代码中有对其修改,位于frameworks/ex/chips),会编译成libchips的jar包,app在编译时把它作为静态库编译. 如图所示,其中有"+10"字样的所在行就是RecipientEditTextView控件.每个号码有对应联系人的话会显示相应头像和名称,图像为一个圆角矩形,代码中对应的数据机构为一个chip.10表示已

(转载)VS2010/MFC编程入门之十三(对话框:属性页对话框及相关类的介绍)

前面讲了模态对话框和非模态对话框,本节开始鸡啄米讲一种特殊的对话框--属性页对话框.另外,本套教程所讲大部分对VC++各个版本均可适用或者稍作修改即可,但考虑到终究还是基于VS2010版本的,所以将<VC++/MFC编程入门>改为<VS2010/MFC编程入门>. 属性页对话框的分类 属性页对话框想必大家并不陌生,XP系统中桌面右键点属性,弹出的就是属性页对话框,它通过标签切换各个页面.另外,我们在创建MFC工程时使用的向导对话框也属于属性页对话框,它通过点击"Next&