欢迎访问移动开发之家(rcyd.net),关注移动开发教程。移动开发之家  移动开发问答|  每日更新
页面位置 : > > > 内容正文

Bootstrap 3 主要css样式

来源: 开发者 投稿于  被查看 45534 次 评论:165

Bootstrap 3 主要css样式


排版

.container//一个容器,宽度为“12”
.container-fluid//充满窗口的容器
.row//行
.col-xs-*//宽度为*的列(手机屏幕)
.col-sm-*//宽度为*的列(平板屏幕)
.col-md-*//宽度为*的列(中等屏幕)
.col-lg-*//宽度为*的列(大屏幕)
.col-md-offset-*//列向右侧偏移*
.col-md-push-3//列向下便偏移*

文本

<h1> <h2> <h3> <h4> <h5> <h6>
.lead//突出显示
.mark//高亮
.del//删除线
.s//无用文本(删除线)
.ins//插入文本(下划线)
.u//下划线
.small//小号文本
.strong//加粗
.em//斜体
.text-left//左对齐
.text-center//居中
.text-right//右对齐
.text-justify//充满行
.text-nowrap//不换行
.text-lowercase//全小写
.text-uppercase//全大写
.text-capitalize//首字母大写
.abbr//带有解释的缩略语
<address>//地址格式
<blockquote>//引用样式
<footer>//引用来源
.blockquote-reverse//右对齐的引用格式
<ul><li>..</li>..</ul>//带点符号的无序列表
<ol><li>..</li>..</ol>//带数字符号的有序列表
.list-unstyled//无样式列表
.list-inline//行内列表
<dl><dt>..</dt><dd></dd>..</dl>//描述列表
.dl-horizontal//同行描述列表
<code>//小代码块
<pre>//大代码块
<var>//数学变量
<samp>//结果

样式

<table> .table //表格
.table-striped//表格斑马条纹样式
.table-bordered//表格边框样式
.table-hover//表格悬停样式
.table-condensed//表格紧缩
.active//表格活动样式
.success//表格积极样式
.info//表格提示样式
.warning//表格表格警告样式
.danger//表格危险样式
.form-group//表单样式
<select>下拉列表样式
.readonly//只读状态
.btn//按钮
.btn-default//默认按钮样式
.btn-primary//首选按钮样式
.btn-success//成功按钮样式
.btn-info//信息按钮样式
.btn-warning//警告按钮样式
.btn-danger//危险按钮样式
.btn-link//链接按钮样式
.btn-lg//大按钮样式
.btn-sm//小按钮样式
.btn-xs//超小按钮样式
.btn-block//块级按钮
.active//已激活按钮
.img-rounded//圆角图片
.img-circle//圆图片
.img-thumbnail//带框图片

用户评论