css3怎样改变文字样式

在 CSS3 中，可以通过字体相关属性和文本相关属性来改变文字样式。下面按常见需求分类说明：

一、改变字体本身样式

1. 字体类型

p {
  font-family: "Microsoft YaHei", Arial, sans-serif;
}

2. 字体大小

p {
  font-size: 16px;
}

3. 字体粗细

p {
  font-weight: bold; /* normal | bold | 100~900 */
}

4. 字体样式（斜体）

p {
  font-style: italic; /* normal | italic | oblique */
}

5. 字体变体（小型大写字母）

p {
  font-variant: small-caps;
}

二、改变文字颜色与背景

6. 文字颜色

p {
  color: #333;
}

7. 文字背景色

p {
  background-color: #f5f5f5;
}

三、改变文字排版样式

8. 文本对齐

p {
  text-align: center; /* left | right | justify */
}

9. 行高

p {
  line-height: 1.6;
}

10. 字间距

p {
  letter-spacing: 2px;
}

11. 词间距

p {
  word-spacing: 5px;
}

12. 首行缩进

p {
  text-indent: 2em;
}

四、文字装饰效果

13. 下划线 / 删除线

a {
  text-decoration: none; /* underline | line-through | overline */
}

14. 文字阴影（CSS3）

p {
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

五、CSS3 新增文字特性

15. 文字溢出省略号

p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

16. 自定义字体（@font-face）

@font-face {
  font-family: "MyFont";
  src: url("myfont.woff2");
}

p {
  font-family: "MyFont";
}

17. 文字渐变（配合背景裁剪）

p {
  background: linear-gradient(red, blue);
  -webkit-background-clip: text;
  color: transparent;
}

示例汇总

.text {
  font-family: Arial;
  font-size: 18px;
  font-weight: bold;
  color: #ff5722;
  text-shadow: 1px 1px 2px #000;
}

如果你有具体想实现的效果（比如“发光文字”“竖排文字”“艺术字”），可以直接告诉我。