1. text-transform：文本大小写控制
-
作用：专门设置文本的大小写格式，仅对英文文本生效
-
可选值 ：
none：默认值，文本正常显示capitalize：每个单词首字母大写uppercase：所有字母大写lowercase：所有字母小写
-
示例：
p {
/* 首字母大写 /
text-transform: capitalize;
/ 全部大写 /
/ text-transform: uppercase; */
}
2. text-decoration：文本修饰
-
作用：设置 / 清除文本的修饰线（如下划线、删除线等）
-
常用值 ：
none：默认值，清除所有修饰线（常用于去除 a 标签默认下划线）underline：添加下划线line-through：添加删除线overline：添加上划线
-
示例：
a {
/* 清除链接默认下划线 /
text-decoration: none;
}
.price {
/ 原价添加删除线 */
text-decoration: line-through;
}
3. letter-spacing：字符间距
-
作用：指定字符之间的间距（支持中、英文）
-
语法 ：
letter-spacing: 数值+单位;（px/em/rem 等） -
示例：
h2 {
/* 字符间距增加3像素 */
letter-spacing: 3px;
}
4. word-spacing：单词间距
-
作用：以空格为分隔单位，设置英文单词之间的间距（对无空格的文本无效）
-
语法 ：
word-spacing: 数值+单位; -
示例：
p {
/* 单词间距设置为20像素 */
word-spacing: 20px;
}
5. text-align：文本对齐方式
-
作用：设置文本在块级容器内的水平对齐方式
-
可选值 ：
left：默认值，文本左对齐right：文本右对齐center：文本居中对齐justify：两端对齐（需文本多行才生效）
-
注意：仅对块级元素 / 设置宽度的行内块元素生效，行内元素无效果
-
示例：
.title {
/* 标题居中对齐 */
text-align: center;
}
6. text-indent：首行缩进
-
作用：设置文本首行的缩进距离
-
语法 ：
text-indent: 数值+单位;- 正值：首行向右缩进（如 2em = 两个字符宽度，常用作段落缩进）
- 负值：首行向左缩进（可用于隐藏文本）
-
示例：
p {
/* 首行缩进2个字符 /
text-indent: 2em;
/ 左缩进隐藏文本 /
/ text-indent: -999px; */
}
7. white-space：空白处理
-
作用：控制网页中文本的空白（空格、换行、制表符）如何显示
-
核心值 ：
normal：默认值，合并多个空格 / 换行，自动换行nowrap：强制文本单行显示，不换行（常用于省略号效果）pre：保留所有空白（如换行、空格），类似<pre>标签
-
示例：
.box {
/* 强制文本不换行 */
white-space: nowrap;
}
8. text-overflow：文本溢出处理
-
作用：指定文本溢出包含元素时的显示方式
-
常用值 ：
clip：默认值，直接裁剪溢出文本ellipsis：溢出文本以省略号显示（需配合overflow:hidden和white-space:nowrap）
-
经典场景：单行文本省略号：
.text-ellipsis {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
width: 200px;
}
9. vertical-align：垂直对齐
-
作用：设置行内元素 / 行内块元素的垂直对齐方式（如图文、表单元素对齐）
-
可选值 ：
baseline：默认值，沿字母 x 基线对齐top：元素顶部与行内最高元素对齐middle：元素居中对齐bottom：元素底部与行内最低元素对齐
-
核心应用：解决图片底部 3 像素空白、调整图文对齐
-
示例：
img {
/* 解决图片3像素空白 */
vertical-align: middle;
}
10. text-shadow：文本阴影
-
作用：为文本添加阴影效果
-
语法 ：
text-shadow: h-shadow v-shadow blur color;h-shadow：水平偏移（必写，正值右移 / 负值左移）v-shadow：垂直偏移（必写，正值下移 / 负值上移）blur：模糊半径（可选，值越大越模糊，默认 0）color：阴影颜色（可选，默认继承字体颜色）
-
示例：
h1 {
/* 文本阴影：右5px、下5px、模糊3px、灰色 */
text-shadow: 5px 5px 3px #ccc;
}
11. box-shadow：盒子阴影
-
作用：为元素（盒子）添加阴影效果（区别于文本阴影）
-
语法 ：
box-shadow: h-shadow v-shadow blur color;（参数同 text-shadow） -
扩展 ：可添加 inset 设置内阴影（如
box-shadow: inset 2px 2px 3px #666;） -
示例：
.card {
width: 200px;
height: 200px;
/* 盒子阴影：右8px、下8px、模糊5px、浅黑色 */
box-shadow: 8px 8px 5px rgba(0,0,0,0.2);
}
总结
以上 11 个属性覆盖了文本样式的核心场景：
- 基础排版：
text-transform/letter-spacing/word-spacing/text-align/text-indent - 溢出与空白：
white-space/text-overflow - 对齐与修饰：
text-decoration/vertical-align - 视觉增强：
text-shadow/box-shadow
补充：
行高（line height）,文字占有的实际高度
行高=上间距+文字大小+下间距，
作用：
（1）、由于上间距=下间距，设置高度跟行高一致，可以实现文本的垂直居中
（2）、使用行高来控制第一行文本与第二行文本之间的距离
line-height: ; 设置行高
可选值：
xxx长度单位 例如：30px
数值 例如：2，3，1.5，是当前字体大小的倍数，当前没有就继承祖先元素
font中也可以指定行高