Bootstrap 排版正文

对正文排版，Bootstrap定义的默认字体栈为 "Helvetica Neue"、Helvetica、Arial、 sans-serif，它们也是主流操作系统默认支持的标准字体。万一明确指定的字体都不存在，负责兜底儿的 sans-serif 会告诉浏览器使用默认的字体。

Bootstrap中，默认的全局 font-size 是 14px，line-height 是 20px，color 是 #333。这些样式应用到了 <body> 和所有的段落元素。此外，对所有段落，还定义了1/2行高（即，默认值为10px）的margin-bottom。如：

<p> Nullam quis risus eget urna ….</p>

正文的排版效果如图 3‑2 所示：

图3-2 正文排版

在 variables.less 文件中，定义了LESS变量 @baseFontSize 和 @baseLineHeight，它们决定了排版尺寸。第一个变量定义全局 font-size，第二个变量定义全局 line-height。重新定义这些变量，就可以改变Bootstrap的默认样式。

关于作者

歪脖先生，十五年以上软件开发经验，酷爱Web开发，精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等，著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》，并全部在 GitHub 上开源。

Bootstrap 排版正文相关推荐

Bootstrap排版之标题
Bootstrap排版之标题 1.定义标题样式 2.运行效果 3.定义 4.运行效果,表面上看是差不多的,但其实你看这两个的源代码,第二种样式是没有定义margin-top和 marging-bott ...
吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：移除默认的列表样式
<!DOCTYPE html> <html><head><title>菜鸟教程(runoob.com)</title> <meta n ...
Bootstrap 排版
2019独角兽企业重金招聘Python工程师标准>>> Bootstrap 使用 Helvetica Neue. Helvetica. Arial 和 sans-serif 作为其默 ...
吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：设定文本对齐,段落中超出屏幕部分文字自动换行...
<!DOCTYPE html> <html><head><title>菜鸟教程(runoob.com)</title> <meta n ...
吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：设置浮动和偏移
<!DOCTYPE html> <html><head><title>菜鸟教程(runoob.com)</title> <meta n ...
Bootstrap 排版和链接
Bootstrap 为屏幕.排版和链接专门设置了以下全局样式: 移除了body的 margin,这样内容就会紧贴浏览器窗口的边缘: 设置了 body 的背景颜色 background-color: w ...
【秃头系列】-【本科生毕设论文格式Word】自动生成论文多级标题并排版正文
文章目录 01 - 论文多级标题及正文 1.1 - 多级标题 1.2 - 正文 02 - 如何自动生成 2.1 - 格式约定 2.2 - 设置多级标题 2.2.1 - 设置标题样式 2.2.2 - 设 ...
Bootstrap ——排版、表格、表单、图片、button 学习博客（二）
Bootstrap中的排版 1. 排版标题部分文本部分对齐 .text-left :文字左对齐 .text-center :文字居中对齐 .text-right :文字右对齐 .text-low ...
使用bootstrap排版
今天用bootstrap框架排出主页面和增加界面,我们这使用的是bootstrap5,以下是bootstrap5官网链接. 简介 · Bootstrap v5 中文文档 v5.1 | Bootstra ...

Bootstrap 排版正文

Bootstrap 排版正文相关推荐

最新文章

热门文章