css字体样式大全

/* CSS 字体样式大全 */

/* 1. 设置字体系列 */
body {
    font-family: Arial, sans-serif; /* 使用 Arial 字体，如果没有则使用无衬线字体 */
}

/* 2. 设置字体大小 */
h1 {
    font-size: 24px; /* 设置标题字体大小为 24 像素 */
}

/* 3. 设置字体粗细 */
p {
    font-weight: bold; /* 设置段落文本为粗体 */
}

/* 4. 设置字体样式（斜体） */
em {
    font-style: italic; /* 设置强调文本为斜体 */
}

/* 5. 设置行高 */
p {
    line-height: 1.5; /* 设置段落文本的行高为 1.5 倍 */
}

/* 6. 设置字母间距 */
h2 {
    letter-spacing: 2px; /* 设置二级标题的字母间距为 2 像素 */
}

/* 7. 设置单词间距 */
p {
    word-spacing: 4px; /* 设置段落文本的单词间距为 4 像素 */
}

/* 8. 设置文本对齐方式 */
div {
    text-align: center; /* 设置 div 内文本居中对齐 */
}

/* 9. 设置文本转换 */
h3 {
    text-transform: uppercase; /* 将三级标题文本转换为大写 */
}

/* 10. 设置文本装饰 */
a {
    text-decoration: underline; /* 给链接添加下划线 */
}

/* 11. 设置字体阴影 */
h1 {
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); /* 给一级标题添加阴影效果 */
}

以上代码展示了常见的 CSS 字体样式属性及其用法。每一段代码都包含了一个简要的注释来解释其功能。