bootstrap学习笔记

一.container
页面容器

二.栅格系统
一行分成12列:
div.row为一行
div.col-md-12 //列,不挤压
div.col-xs-12 //列,挤压

<div class="row">
<div class="col-md-6"></div>
<div class="col-md-6"></div>
</div>

三.图片自动生成
<img src="holder.js?100%*300" />

四.块对齐和文本对齐
文本对齐:
p.text-left
p.text-center
p.text-right

块对齐:
pull-left
pull-right
center-block

五.排版样式
h1.page-header
p.lead
small //略微小的字体
strong // 加粗
em //倾斜

文字的颜色:
p.text-muted 柔和色
p.text-primary 浅蓝色
p.text-success 深绿色
p.text-info 深蓝色
p.text-warning 棕色
p.text-danger 红色

六.表格样式
table.table
table.table-bordered 边框
table.table-hover 鼠标放上去变色
table.striped 隔行变色
table.table-condensed 紧缩表格

表格行颜色:
tr.active 灰色
tr.success 红色
tr.danger 黄色
tr.warning 绿色

响应式表格(水平滚动条):
table.table包裹在div.table-responsive

七.代码
pre
code


..其他:
清除浮动:clearfix


posted @ 2014-12-01 20:29  rorshach  阅读(141)  评论(0编辑  收藏  举报