在颜色之后,一个网页页面最重要的特性大概就是字体。在本页面中我不会示范任何 「花招」,但我会指出CSS允许的字体变化范围。
由于并非所有的电脑都有所有的字体(字体成千上万,且多数不是免费的, CSS提供了一个应变系统。你先列出你想要的字体,然后为首选的字体如果无法使用的 备用字体和你也应以通用的字体来作为这个列表的结束。通用字体共有五种 serif (衬线体), sans-serif(无衬线体), monospace(等宽体), cursive(草书体) 和 fantasy(幻想体) .
下表显示下表展示不同字体的范例(你 的浏览器可能无法分辨所有这些字体),你可以看到这五种 通用字体在你的浏览器上所显示的效果:
| Font family | Your browser | Sample image |
|---|---|---|
| 'sans-serif': normal fonts without serifs | ||
| 'serif': normal fonts with serifs | ||
| 'monospace': fixed-width fonts | ||
| 'cursive': fonts that emulate handwriting | ||
| 'fantasy': decorative fonts, for titles, etc. | ||
大部分同一类别的字体有多种不同的样式,典型的 有粗体字和斜体字,也经常有粗斜体字,稍少见的有 小体大写字,少数情况下有极细字/极粗字或延展字/压缩字。
下表展示了许多不同的样式。除非你有非常丰富的字集, 否则其中许多行看来会是相同的:
| rule | serif | sans-serif |
|---|---|---|
| Styles | ||
font-style: normal
| The Quick… | The Quick… |
font-style: italic
| The Quick… | The Quick… |
font-style: oblique
| The Quick… | The Quick… |
| Weights | ||
font-weight: 100
| The Quick… | The Quick… |
font-weight: 200
| The Quick… | The Quick… |
font-weight: 300
| The Quick… | The Quick… |
font-weight: normal
| The Quick… | The Quick… |
font-weight: 500
| The Quick… | The Quick… |
font-weight: 600
| The Quick… | The Quick… |
font-weight: bold
| The Quick… | The Quick… |
font-weight: 800
| The Quick… | The Quick… |
font-weight: 900
| The Quick… | The Quick… |
| Variants | ||
font-variant: normal
| The Quick… | The Quick… |
font-variant: small-caps
| The Quick… | The Quick… |
| Stretch | ||
font-stretch: ultra-condensed
| The Quick… | The Quick… |
font-stretch: extra-condensed
| The Quick… | The Quick… |
font-stretch: condensed
| The Quick… | The Quick… |
font-stretch: semi-condensed
| The Quick… | The Quick… |
font-stretch: normal
| The Quick… | The Quick… |
font-stretch: semi-expanded
| The Quick… | The Quick… |
font-stretch: expanded
| The Quick… | The Quick… |
font-stretch: extra-expanded
| The Quick… | The Quick… |
font-stretch: ultra-expanded
| The Quick… | The Quick… |
CSS字体模块具有更多的属性来指定特殊的样式 (对于提供几种变体的字体),特别是 font-variant 属性有更多的值。
创建于 17 Jan 2001;
最后更新