Boostrap全局CSS样式

1、Bootstrap提供的CSS Reset

* { box-sizing: border-box; }

body { font ...; color: #333; background: ...; margin: 0;}

h1 { font-size: ;  margin-top: 20px;  margin-bottom: 10px;}

h2 { font-size: ;  margin-top: 20px;  margin-bottom: 10px;}

h3 { font-size: ;  margin-top: 20px;  margin-bottom: 10px;}

h4  { font-size: ;  margin-top: 10px;  margin-bottom: 10px;}

h5  { font-size: ;  margin-top: 10px;  margin-bottom: 10px;}

h6  { font-size: ;  margin-top: 10px;  margin-bottom: 10px;}

a { color:;  text-decoration: ;}

img { border: 0;  vertical-align: middle; }

p { margin-bottom:10px; }

......

2、Bootstrap全局CSS样式——按钮——简单&有趣

.btn { padding:;  border: ;}

.btn-default { color:;  background:;  border-color:;}

----------------------

.btn-danger

.btn-success

.btn-warning

.btn-info

.btn-primary

---------------------

.btn-lg

.btn-sm

.btn-xs

----------------------

.btn-block

----------------------

.pull-left { float: left; }

.pull-right { float: right; }

3、Bootstrap全局CSS样式——图片——简单&有趣

.img-rounded

.img-circle

.img-thumbnail 缩略图片/拇指图片

.img-responsive  响应式图片

4、Bootstrap全局CSS样式——排版和代码

.text-danger

.text-success

.text.warning

.text-info

.text-primary

.bg-danger

.bg-success

.bg-warning

.bg-info

.bg-primary

.text-left

.text-right

.text-center

.text-justify  文本两端调整对齐

.text-uppercase

.text-lowercase

.text-capitalize

.list-unstyled

.list-inline

5、Bootstrap全局CSS样式——表格——简单&有趣

.table

.table-bordered 带边框的表格

.table-responsive 响应式表格  注意：使用在table的父元素上，而不是table上

.table-striped 隔行变色的表格

.table-hover 带悬停效果的表格