bootstrap 不换行css_第二章之Bootstrap 页面排版样式

Bootstrap，来自 Twitter，是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快捷。

学习要点：

1.页面排版

本节课我们主要学习一下 Bootstrap 全局 CSS 样式中的排版样式，包括了标题、页面主体、对齐、列表等常规内容。

一．页面排版

Bootstrap 提供了一些常规设计好的页面排版的样式供开发者使用。

1.页面主体

Bootstrap 将全局 font-size 设置为 14px，line-height 行高设置为 1.428(即20px)；

段落元素被设置等于 1/2 行高(即 10px)；颜色被设置为#333。

//创建包含段落突出的文本

Bootstrap 框架

Bootstrap 框架

Bootstrap 框架

Bootstrap 框架

Bootstrap 框架

2.标题

//从 h1 到 h6

Bootstrap 框架

//36px

Bootstrap 框架

//30px

Bootstrap 框架

//24px

Bootstrap 框架

//18px

Bootstrap 框架

//14px

Bootstrap 框架

//12px

我们从 Firebug 查看元素了解到， Bootstrap 分别对 h1 ~ h6 进行了 CSS 样式的重构，并且还支持普通内联元素定义 class=(.h1 ~ h6)来实现相同的功能。

//内联元素使用标题字体