css常用样式font设置字体的多种变换(实例详解)

关于“css常用样式font设置字体的多种变换(实例详解)”，我为您提供以下完整攻略：

一、字体大小

1. 使用font-size属性

可以使用font-size属性设置字体大小，例如：

p {
    font-size: 16px;
}

表示设置p标签中字体大小为16像素。

2. 使用em或rem作为单位

也可以使用em或rem作为单位，相对于父元素或根元素的字体大小进行计算，例如：

body {
    font-size: 16px;
}

p {
    font-size: 1em; /* 相当于16px */
}

h1 {
    font-size: 2em; /* 相当于32px */
}

上面的代码表示，p标签的字体大小为父元素body的字体大小，即16像素，而h1标签的字体大小是body字体大小的2倍，即32像素。

二、字体样式

1. 使用font-style属性

可以使用font-style属性设置字体样式，例如：

p {
    font-style: italic;
}

表示设置p标签中字体为斜体。

2. 使用font-weight属性

可以使用font-weight属性设置字体粗细，例如：

p {
    font-weight: bold;
}

表示设置p标签中字体为粗体。

三、字体系列

1. 使用font-family属性

可以使用font-family属性设置字体系列，例如：

body {
    font-family: Arial, sans-serif;
}

表示设置body中使用Arial字体，如果Arial字体不可用，则使用后备字体sans-serif。

2. 使用@font-face规则引入自定义字体

可以使用@font-face规则引入自定义的字体，例如：

@font-face {
    font-family: myFont;
    src: url('myFont.ttf');
}

h1 {
    font-family: myFont;
}

上面的代码表示，使用@font-face规则引入字体文件myFont.ttf，然后使用font-family属性将这个字体应用到h1标签中。

至于更多关于CSS字体样式的使用技巧和注意事项，可以到我网站上查看更多详细攻略。