字体css制作
字体CSS制作方法
定义字体族
通过font-family属性指定字体名称，支持多个备选字体以确保兼容性：
body {
font-family: "Helvetica Neue", Arial, sans-serif;
}控制字体大小
使用font-size属性设置绝对或相对尺寸：
h1 {
font-size: 2rem; /* 相对单位 */
}
p {
font-size: 16px; /* 绝对单位 */
}调整字体粗细
font-weight支持数值（100-900）或关键词：
.bold-text {
font-weight: 700; /* 等效于bold */
}
.light-text {
font-weight: lighter;
}设置字体样式
通过font-style控制斜体显示：
.italic {
font-style: italic;
}行高与间距
line-height改善可读性，letter-spacing调整字符间距：
article {
line-height: 1.6;
letter-spacing: 0.5px;
}自定义字体
使用@font-face引入外部字体文件：
@font-face {
font-family: 'CustomFont';
src: url('path/to/font.woff2') format('woff2');
}字体颜色与装饰
color设置文字颜色，text-decoration添加下划线等效果：
.highlight {
color: #FF5733;
text-decoration: underline wavy;
}响应式字体 结合媒体查询实现自适应字号：
@media (max-width: 768px) {
body {
font-size: 14px;
}
}字体优化提示
- 优先使用系统默认字体提升加载速度
- WOFF2格式具有最佳压缩率
- 字体文件大小建议控制在300KB以内
- 使用
font-display: swap避免布局偏移
