CSS 字体属性
font-size
字号大小,可以使用相对长度,也可以使用绝对长度。其中相对长度比较常见,推荐使用像素px,绝对长度使用较少。
单位 | 说明 |
---|---|
em | 相对于当前对象内文本的字体尺寸 |
px | 像素,最常用,推荐使用 |
in | 英寸 |
cm | 厘米 |
mm | 毫米 |
pt | 点 |
绝对长度单位 | 说明 |
font-family
设置字体,比如宋体,微软雅黑,黑体等。
中文字体要加引号,英文一般不需要加引号,如英文中间有空格,要加引号。
如有多种字体,从前往后查找,如果都没有,使用系统默认字体。
font-weight
字体加粗
参数 | 说明 |
---|---|
normal | 正常字体,相当于 number 为 400 |
bold | 粗体,相当于 number 为 700 |
bolder | 特粗体 |
lighter | 细体 |
number | 100, 200, 300, 400, 500, 600, 700, 800, 900 |
font-style
字体倾斜除了使用 i 和 em 标签之外,可以使用 CSS 设置
参数 | 说明 |
---|---|
normal | 默认值,浏览器按照标准的字体样式显示 |
italic | 浏览器显示斜体的字体样式 |
oblique | 浏览器会显示倾斜的字体样式 |
CSS 字体连写
必须按照以下格式写,不能更换顺序,各个属性以空格隔开,其中不需要设置的属性可以忽略,去默认值,但必须保留 font-size 和 font-family 的属性
选择器 {font: font-style font-weight font-size/line-height font-family;}
<!DOCTYPE html>
<html lang="en">
<head>
<style type="text/css">
div {
/*
font-size: 16px;
font-family: "宋体", Arial, "Arial Black";
font-weight: bold;
font-style: italic;
*/
font:normal 400 16px "Arial Black";
}
</style>
</head>
<body>
<div>Hello World!</div>
</body>
</html>