@font-face
边框(Border)
Border-color
Border-image
Border-radius
box-shadow
背景(Background)
background-origin
background-clip
Background-size
Multiple backgrounds
颜色(Color)
HSL colors
HSLA colors
opacity
RGBA colors
文本(Text effects)
text-shadow
text-overflow
word-wrap
用户界面(User-interface)
box-sizing
resize
outline
outline-width
outline-style
outline-offset
outline-color
nav-index
nav-up
nav-right
nav-down
nav-left
基础盒模型(Basic box model)
overflow
overflow-x
overflow-y
内容(Generated Content)
content
其它模块(Other modules)
media queries
Speech
columns
column-width
column-span
column-rule
column-rule-color
column-rule-width
column-rule-style
column-gap
column-fill
column-count
column-break-before
column-break-after
@font-face

选择器(selectors)

子串匹配的属性选择符 E[att^="val"]
子串匹配的属性选择符 E[att$="val"]
子串匹配的属性选择符 E[att*="val"]
结构性伪类 E:root
结构性伪类 E:nth-child(n)
结构性伪类 E:nth-last-child(n)
结构性伪类 E:nth-of-type(n)
结构性伪类E:nth-last-of-type(n)
结构性伪类 E:last-child
结构性伪类 E:first-of-type
结构性伪类 E:only-child
结构性伪类 E:only-of-type
结构性伪类 E:empty
UI元素状态伪类 E:checked
UI元素状态伪类 E:enabled
UI元素状态伪类 E:disabled
UI元素状态伪类 E::selection
否定伪类 E:not(s)
目标伪类 E:target
通用兄弟元素选择器 E ~ F

语法:

@font-face :{属性: 取值;}

取值:

font-family:
设置文本的字体名称。
font-style:
设置文本样式。
font-variant:
设置文本是否大小写。
font-weight:
设置文本的粗细。
font-stretch:
设置文本是否横向的拉伸变形。
font-size:
设置文本字体大小。
src
设置自定义字体的相对路径或者绝对路径,注意,此属性只能在@font-face规则里使用。

说明:

@font-face 能够加载服务器端的字体文件,让客户端显示客户端所没有安装的字体。【微软的IE 5已经是开始支持这个属性,但是只支持微软自有的.eot (Embedded Open Type) 格式,而其他浏览器直到现在都没有支持这一字体格式。然而,从Safari 3.1开始,网页重构工程师已经可以设置.ttf(TrueType)和.otf(OpenType)两种字体做为自定义字体了。】

兼容性:

.eot格式

类型 IEInternet Explorer FirefoxFirefox ChromeChrome OperaOpera SafariSafari
版本 (√)IE6 (×)Firefox 2.0 (×)Chrome 1.0.x (×)Opera 9.63 (×)Safari 3.1
(√)IE7 (×)Firefox 3.0 (×)Chrome 2.0.x (×)Safari 4
(√)IE8

.ttf格式

类型 IEInternet Explorer FirefoxFirefox ChromeChrome OperaOpera SafariSafari
版本 (×)IE6 (×)Firefox 2.0 (×)Chrome 1.0.x (×)Opera 9.63 (√)Safari 3.2.1
(×)IE7 (×)Firefox 3.0 (×)Chrome 2.0.x (√)Opera 10 (√)Safari 4
(×)IE8 (√)Firefox 3.5

EOT字体示例(本示例源自微软Festival of Ornament):