文本格式
该文本样式与一些文本格式属性。 标题使用text-align, text-transform和color属性。 段落缩进,对齐,并指定字符间距。 下划线从该有色删除“试一试”的链接。
文字颜色
该color
属性用来设置文本的颜色。
使用CSS,颜色是最经常被指定:
- 色彩的名字-像"red"
- 一个十六进制值-象"#ff0000"
- 一个RGB值-像"rgb(255,0,0)"
看看CSS颜色值可能的颜色值的完整列表。
对于一个页面默认的文本颜色在体内选择限定。
注意:对于符合W3C CSS:如果定义color 属性,还必须定义background-color 属性。 |
文本对齐
该text-align
属性用于设置文本的水平对齐方式。
文本可以向左或右对齐,居中还是有道理的。
下面的示例演示中心对齐,左,右对齐文本(左对齐是默认的,如果文本方向是左到右,右对齐是默认的,如果文本方向是从右到左):
当text-align
属性被设置为"justify" ,每行被拉伸,使得每行具有等于宽度,和左,右边缘是直的(如在杂志和报纸):
文本修饰
该text-decoration
属性用来设置或从文本中删除装饰。
该值text-decoration: none;
经常被用来从链接中删除下划线:
其他text-decoration
值用来装饰的文字:
例
h1 {
text-decoration: overline;
}
h2 {
text-decoration: line-through;
}
h3 {
text-decoration: underline;
}
试一试» 注意:不建议强调文本不是一个链接,因为这往往混淆了读者。 |
文本转换
该text-transform
属性用于指定文本大写和小写字母。
它可以用来把一切都变成大写或小写字母,大写或每个单词的第一个字母:
例
p.uppercase {
text-transform: uppercase;
}
p.lowercase {
text-transform: lowercase;
}
p.capitalize {
text-transform: capitalize;
}
试一试» 文本缩进
的text-indent
属性用于指定文本的第一行的缩进:
字母间距
该letter-spacing
属性用于指定文本字符之间的空间。
下面的例子演示了如何增加或减少字符之间的空间:
行高
该line-height
属性用于指定线之间的空间:
文字方向
该direction
属性用于更改元素的文本方向:
字间距
的word-spacing
属性用于在文本来指定字之间的空间。
下面的例子演示了如何增加或减少单词之间的空格:
更多示例
禁用元素中文字环绕
这个例子演示了如何禁用元素中文字换行。
图像的垂直对齐
这个例子演示了如何设置图像的垂直对齐文本。
添加阴影文本
这个例子演示了如何将阴影添加到文本。
自测练习用!
所有CSS文本属性
属性 | 描述 |
---|---|
color | 设置文本的颜色 |
direction | 指定文本的方向/书写方向 |
letter-spacing | 增加或减少的字符之间的空间中的文本 |
line-height | 设置行高度 |
text-align | 指定文本的水平对齐方式 |
text-decoration | 指定装饰添加到文本 |
text-indent | 指定一个文本块中的第一行的缩进 |
text-shadow | 指定添加到文本的阴影效果 |
text-transform | 控制文字的资本 |
unicode-bidi | 与一起使用方向属性来设置或返回文本是否应该重写以支持多种语言在同一文件中 |
vertical-align | 设置元素的垂直取向 |
white-space | 指定元素中空白的处理方式 |
word-spacing | 增加或减少的话之间的空间中的文本 |