Foundation 文本

Foundation 默认设置

Foundation 使用浏览器默认字体大小 (font-size:100%)。对于大多数桌面浏览器来说,字体默认为 16px。对于大多数移动端浏览器来说,字体默认为 12px。默认的字体为 "Helvetica Neue", line-height 默认为 1.5

以上默认的设置均是针对 <body> 元素。


Foundation 文字排列设计

本章节我们将讨论 Foundation 的文字排列设计。

以下实例的真实样式请通过点击"尝试一下"按钮查看。


<h1> - <h6>

Foundation 渲染的 HTML 标题 (<h1><h6>) 如下所示:

实例

h1 标题

h2 标题

h3 标题

h4 标题

h5 标题
h6 标题

尝试一下 »

提示: 如果需要创建一个浅色的标题,可以在元素上添加 .subheader 类:

实例

h1.subheader

h2.subheader

h3.subheader

h4.subheader

h5.subheader
h6.subheader

尝试一下 »

<small>

在 Foundation 中, HTML <small> 元素用于创建一个浅色的副标题:

实例

h1 heading secondary text

h2 heading secondary text

h3 heading secondary text

h4 heading secondary text

h5 heading secondary text
h6 heading secondary text

尝试一下 »

<a>

Foundation <a> 元素的样式如下所示:

实例

这是一个 链接


尝试一下 »

<abbr>

Foundation <abbr> 元素的样式如下所示:

实例

The WHO was founded in 1948.


尝试一下 »

<blockquote>

Foundation <blockquote> 元素的样式如下所示:

实例

从W3Cschool开始!

W3Cschool教程

尝试一下 »

<dl>

Foundation <dl> 元素的样式如下所示:

实例

Coffee
- black hot drink
Milk
- white cold drink

尝试一下 »

<code>

Foundation <code> 元素的样式如下所示:

实例

以下 HTML 元素: span, section, 和 div 是文档的一部分。


尝试一下 »

<kbd>

Foundation <kbd> 元素的样式如下所示:

实例

按下 ctrl + p 键打开打印窗口。


尝试一下 »

<hr>

Foundation <hr> 元素的样式如下所示: