CSS 字体速记


本文向大家介绍CSS 字体速记,包括了CSS 字体速记的使用技巧和注意事项,需要的朋友参考一下

示例

使用语法:

element {
    font: [font-style] [font-variant] [font-weight] [font-size/line-height] [font-family];
}

您可以将所有与字体相关的样式都用一个font速记形式声明。只需使用该font属性,然后按正确的顺序放置您的值。

例如,要使所有p元素以20px的字体大小加粗并使用Arial作为字体系列,通常应按以下方式对其进行编码:

p {
    font-weight: bold;
    font-size: 20px;
    font-family: Arial, sans-serif;
}

但是,使用字体速记可以将其压缩如下:

p {
    font: bold 20px Arial, sans-serif;
}

注意:既然font-style,font-variant,font-weight和line-height是可选的,他们三人在这个例子中被跳过。重要的是要注意,使用快捷方式会重置未提供的其他属性。另一个要点是,字体快捷方式起作用的两个必要属性是font-size和font-family。如果它们都不同时包含,则忽略快捷方式。

每个属性的初始值:

  • font-style: normal;

  • font-variant: normal;

  • font-weight: normal;

  • font-stretch: normal;

  • font-size: medium;

  • line-height: normal;

  • font-family –取决于用户代理