1. 文字阴影（Text Shadow）：
- 使用 text-shadow 属性可以为文字添加阴影效果。
.text-shadow-example {
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
2. 文字渐变（Text Gradient）：
- 使用 background-clip 和 text-fill-color 属性可以为文字创建渐变效果。
.text-gradient-example {
background: linear-gradient(to right, #3498db, #2ecc71);
-webkit-background-clip: text;
color: transparent;
}
3. 文字描边（Text Stroke）：
- 使用 text-stroke 属性可以为文字添加描边效果。
.text-stroke-example {
-webkit-text-stroke: 2px #3498db;
}
4. 文字填充（Text Fill）：
- 使用 background-clip 和 text-fill-color 属性可以为文字创建填充效果。
.text-fill-example {
background: linear-gradient(to right, #3498db, #2ecc71);
-webkit-background-clip: text;
color: transparent;
}
5. 文字变形（Text Transform）：
- 使用 text-transform 属性可以控制文字的大小写。
.text-transform-example {
text-transform: uppercase;
}
6. 文字间距（Letter Spacing）：
- 使用 letter-spacing 属性可以调整文字之间的间距。
.letter-spacing-example {
letter-spacing: 2px;
}
7. 文字行高（Line Height）：
- 使用 line-height 属性可以设置文字的行高。
.line-height-example {
line-height: 1.5;
}
8. 文字滚动（Text Marquee）：
- 使用 text-overflow 和 white-space 属性可以创建文字滚动效果。
.text-marquee-example {
white-space: nowrap;
overflow: hidden;
text-overflow: marquee-line;
}
这些文本效果属性可以单独使用或者组合使用，创造出各种独特的文字样式。根据设计需求，你可以选择合适的文本效果来增强页面的可读性和视觉吸引力。
转载请注明出处：http://www.zyzy.cn/article/detail/4060/CSS