文本属性

text-align

定义

定义文本的对齐方式。

语法

text-align{
    left | center | right | justify
}

属性值

left：规定文本左对齐。默认值

center：规定文本水平居中对齐

right：规定文本右对齐

justify：规定文本两端对齐

text-decoration

定义

定义文本修饰线

语法

p{
    text-decoration: overline | line-through | underline | none
}

属性值

• overline ：添加上划线
• line-through：添加删除线
• underline：添加下划线
• none：取消修饰线。默认值

text-shadow

定义

定义文本阴影

语法

h1{
    text-shadow:水平偏移 垂直偏移 模糊半径 颜色； 
}

属性值

• x-offset：设置水平偏移，单位是像素。正值向右，负值向左
• y-offset：设置垂直偏移。单位是像素。正值向右，负值向左。
• blur：设置模糊半径。数值越大越模糊。
• color：设置阴影的颜色

text-indent

定义

定义文本缩进

语法

p{
    text-index:相对值 | 固定值
}

属性值

• 相对值
  • em：推荐。em表示一个字符，使用字符设置文本缩进。缩进两个字符，就是2em。
  • rem
  • %
  • vh
  • vw
• 绝对值
  • px：使用像素设置文本缩进。不推荐。

text-transform

定义

定义英文字母大小写转换。

语法

body{
    text-transform:none | capitalize | uppercase | lowercase
}

属性值

• none：默认值。对原字母不进行转换
• capitalize：文本中的每个单词以大写字母开头（转成大写字母开头）
• uppercase：定义仅有大写字母（全部转换成大写字母）
• lowercase：定义无大写字母，仅有小写字母（全部转换成小写字母）

text-overflow

定义

text-overflow属性规定当文本溢出包含元素时发生的事情。

语法

text-overflow: clip|ellipsis|string;

• clip修剪文本
• ellipsis显示省略符号来代表被修剪的文本
• string使用给你定的字符串来代表被修剪的文本

实现text-overflow还需辅助

h1{
    text-overflow: ellipsis; /*换行处加省略号*/
    white-space: nowrap;  /*不让文本换行*/
    overflow: hidden;  /*溢出不可见*/
}

知识点

1.记住文本两端对齐

2.如何添加文本阴影

3.如何添加删除线

4.设置文本缩进的正确姿势