段落是排版中另一个重要元素之一。在Bootstrap中为文本设置了一个全局的文本样式（这里所说的文本是指正文文本）：
1、全局文本字号为14px(font-size)。
2、行高为1.42857143（line-height），大约是20px(大家看到一串的小数或许会有疑惑，其实他是通过LESS编译器计算出来的，当然Sass也有这样的功能)。
3、颜色为深灰色（#333）；
4、字体为"Helvetica Neue", Helvetica, Arial, sans-serif;（font-family），或许这样的字体对我们中文并不太合适，但在实际项目中，大家可以根据自己的需求进行重置
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>段落（正文文本）</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>
<body>
<p>超酷的互联网、IT技术免费学习平台，创新的网络一站式学习、实践体验；服务及时贴心，内容专业、有趣易学。专注服务互联网工程师快速成为技术高手！</p>
<p>超酷的互联网、IT技术免费学习平台，创新的网络一站式学习、实践体验；服务及时贴心，内容专业、有趣易学。专注服务互联网工程师快速成为技术高手！</p>
<p>我是一个段落，你猜我在Bootstrap是以什么样的风格显示。</p>
</body>
</html>
实际项目中，对于一些重要的文本，希望突出强调的部分都会做另外的样式处理。Bootstrap同样对这部分做了一些轻量级的处理。
如果想让一个段落p突出显示，可以通过添加类名“.lead”实现
除此之外，Bootstrap还通过元素标签:<small>、<strong>、<em>和<cite>给文本做突出样式处理。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>强调内容</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>
<body>
<p>我是普通文本，我的样子长成这样我是普通文本，我的样子长成这样我是普通文本，</p>
<p class="lead">我是特意要突出的文本，我的样子成这样。我是特意要突出的文本，我的样子长成这样。</p>
<p>我是一个普通的段落，我不需要强调显示。</p>
<p class="lead">这部分内容需要特别的强调，我和别人长得不一样。</p>
</body>
</html>
cfj
- 浏览: 116081 次
- 性别:
- 来自: 天津
-
最新评论
相关推荐
3. **排版工具**：Bootstrap提供了一系列排版工具，如`<h1>`至`<h6>`的标题、段落（`.lead`）、文本对齐（`.text-left`、`.text-center`、`.text-right`）和强调文本（`.text-muted`、`.text-primary`等）。...
5. **排版（Typography）**：Bootstrap 3 提供了一系列的文本样式和排版工具，如h1到h6的标题、段落、强调文本、引用等。 6. **图标（Glyphicons）**：Bootstrap 3 包含一套基本的图标集，可以方便地插入到网页中，...
9. **基础样式**：Bootstrap 对于常见的HTML元素如标题（`<h1>`到`<h6>`）、段落、强调文本、列表、代码块、表格等都有预设的样式，提供了统一的视觉风格。 10. **自定义和扩展**：Bootstrap 可以通过修改LESS源码...
7. **类型和文本**：包括标题(headings)、段落(paragraphs)、强调(emphasis)、列表(lists)等基本HTML元素的样式调整。 8. **代码示例**：每个组件和功能都配有代码示例，便于开发者理解和应用。 9. **浏览器兼容性...
10. **排版**：Bootstrap 3 提供了简单的排版工具，如页眉（headers）、段落（paragraphs）、内联（inline）和块级（blockquotes）引述、以及列表（unordered and ordered lists）。 11. **图像**：Bootstrap 提供...
Bootstrap提供了一套基本的排版规则和文本样式，包括字体、行高、段落间距等，使得文本内容在视觉上保持一致性。此外，还有标题、引用、强调文本等预设样式。 6. **表格、图片和图标** 在Bootstrap中，表格可以...
7. **响应式设计**：Bootstrap3 强调移动优先的设计理念，意味着模版会自动适应各种屏幕大小。无论是手机、平板还是台式机，都能提供一致且优化的用户体验。 8. **图标库**：Bootstrap3 通常与Font Awesome等图标库...
6. **类型排版**：Bootstrap提供了丰富的文本样式，包括标题、段落、引用、代码块、列表、强调文本等，确保了内容的清晰可读。 7. **表单**：Bootstrap的表单组件提供了一套统一的样式，包括输入框、选择框、复选框...
`.text-*`类用于文本对齐，`.lead`用于强调段落，`.small`用于子标题或辅助文本。 4. **表格（`tables`）**：Bootstrap的表格可以快速实现响应式，通过添加`.table-responsive`类，表格在小屏幕设备上会自动滚动。 ...
3. 字体和行高设置：Bootstrap定义了全局的基础字体大小为14px，行高为20px，并对标签和所有段落应用了这些样式。此外，标签默认具有1/2行高，即10px的底部外边距。 4. 文件引入：要使Bootstrap正常工作，需要在...
3. **排版**：Bootstrap提供了诸如`.h1`到`.h6`的标题样式、段落样式、引用样式、列表样式等，使得文本排版更加统一和专业。此外，还有代码高亮、引号、强调等元素的样式。 4. **字体与图标**：Bootstrap 4引入了...
4. **排版工具**：包括字体设置、文本对齐、段落、强调文本、引用、列表等，使得文本样式统一且易于阅读。 5. **JavaScript插件**：虽然Bootstrap主要是CSS框架，但它也包含了一些基于jQuery的JavaScript插件，如...
- **强调文本**：通过`.lead`类让文本更加突出，通常用于页面介绍段落。 - **文本颜色**：使用如`.text-muted`、`.text-primary`等类来改变文本颜色。 - **对齐方式**：使用`.text-left`、`.text-center`、`.text-...
3. **排版工具**：包括标题（`<h1>`到`<h6>`）、段落、引用、代码块等，以及内联样式如文本对齐、强调和链接。 4. **导航和布局元素**：包含导航栏（navbar）、下拉菜单、面包屑导航、按钮组、分页、模态框、提示...
此模板包含了必要的元数据（如字符集和视口设置）以及对Bootstrap CSS和JS文件的引用。 **1.4 全局样式** Bootstrap提供了许多全局样式规则，如重置浏览器默认样式、字体大小调整等，这些规则有助于确保整个网站...
- `.lead`：用于强调段落的第一行。 - `<blockquote>`：用于引用内容。 ### 实例代码 Bootstrap4可以通过特定的class来快速创建组件。例如，创建一个导航栏可以使用： ```html ...
3. 强调和样式 Bootstrap提供了多种预定义的类来强调文本或改变其视觉效果。例如： - `.text-muted`：创建淡灰色的文本，常用于提示信息。 - `.text-primary`：使用Bootstrap的主色调蓝色，适用于主要的行动号召。...
Bootstrap 3.0 是一个流行的前端开发框架，它极大地简化了网页设计和开发流程。本教程专注于Bootstrap的排版功能，这些排版技巧基于HTML的基本标签，因此即使对初学者来说也较为易懂。我们将详细讲解以下几个方面： ...
例如，`.text-*`用于文本对齐，`.bg-*`用于背景颜色，`.lead`用于强调段落，`.m*`和`.p*`用于添加内外边距。 3. **组件**：Bootstrap3包含大量可复用的UI组件，如按钮、表单、导航条、下拉菜单、模态框、警告提示、...
4. **响应式设计**：Bootstrap强调移动优先的设计原则，这意味着它会根据用户的设备和屏幕大小自动调整布局。在2014年的更新中，可能优化了对手机、平板电脑和桌面设备的支持，确保在各种设备上都能提供良好的用户...