文章目录
字体大小:font-size字体粗细:font-weight字体样式(是否倾斜):font-style字体类型:font-family字体类型:font 属性连写字体大小:font-size
需设置单位,否则无效数字+pxChrome浏览器默认16px大小<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>p {font-size: 40px;}</style></head><body><p>我是一个标签</p></body></html>
字体粗细:font-weight
取值:
纯数字:100~900 的整百数
正常: 400加粗: 700
关键字:
正常: normal加粗: bold不是所有字体都提供了九种粗细,因此部分取值页面中无变化
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>p {font-weight: 700;}</style></head><body><p>我是一个标签</p></body></html>
字体样式(是否倾斜):font-style
取值: 正常(默认值): normal倾斜: italic<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>p {font-style: italic;}</style></head><body><p>我是一个标签</p></body></html>
字体类型:font-family
取值:字体11,字体2,字体3,字体4;字体系列:sans-serif、serif、monospace等。<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>p {font-family: 微软雅黑,楷体,宋体,sans-serif;}</style></head><body><p>我是一个标签</p></body></html>
渲染规则: 从左往右按照顺序查找,如果电脑中未安装该字体,则显示下一个字体如果都不支持,此时会根据操作系统,显示最后字体系列的默认字体
字体类型:font 属性连写
属性名:font取值:font:style weight size family;顺序要求:style weight size family省略要求:只能省略前两个如果觉得《2.2-CSS基础--font 字体大小 粗细 样式》对你有帮助,请点赞、收藏,并留下你的观点哦!