CSS Note 1.1 字体

一、字体示例

1、font-size

/*这四种字体大小是一样的*/
font-size: 16px;
font-size: 100%;
font-size: 1em;
font-size: medium;
/*small和smaller是一样的,其他的从小到大为xx-small | x-small | small | medium | large | x-large | xx-large*/

2、font-variant

font-variant: small-caps;/*字母会变成大写，并且变小,normal是默认值*/
font-variant: normal;

3、font-style

font-style: italic;/*italic斜体,normal默认值,oblique字库中没有斜体字体的话,可以使用，效果一样*/
font-style: normal;
font-style: oblique;

4、font-weight

font-weight: normal;/*normal默认值,bolder字体加粗,lighter更细的字体,bolder更粗的字体,也可以直接取值100-900范围*/
font-weight: bolder;
font-weight: lighter;
font-weight: bold;
font-weight: 100;

5、font和font-family

font-family: "Adobe 楷体 Std R" ,隶书 ;/*可以设置两种以上字体，用逗号隔开，当字库里没有第一种字体时会自动使用第二种字体*/
font:  normal bold  20px 楷体  italic ;/*font-style,font-variant,font-size,font-family,font-weight,字体大小和字体必须有且不可颠倒位置*/

6、@font-face

@font-face {
    /*先设置字体名称，然后在引号中引用web字体路径*/
    font-family: abc;
    src:url("");
}