CSS 文本格式主要用来设置 HTML 元素文本的颜色，对齐方式，行间距等属性

文本颜色

CSS color 属性用来设置文字的颜色

颜色是通过 CSS 最经常的指定

1. 十六进制值 - 如: ＃FF0000
2. 一个 RGB 值 - 如: RGB(255,0,0)
3. 颜色的名称 - 如: red

参阅 CSS 颜色值 查看完整的颜色值

下面的 CSS 样式设置了 body 、h1 、 h2 元素的文本颜色

body {color:red;}
h1 {color:#00ff00;}
h2 {color:rgb(255,0,0);}

运行范例 »

文本的对齐方式

CSS text-align 属性用来设置文本的水平对齐方式

文本可居中或对齐到左或右,两端对齐

当 text-align 设置为 "justify" ，每一行被展开为宽度相等，左，右外边距是对齐（如杂志和报纸）

h1 {text-align:center;}
p.date {text-align:right;}
p.main {text-align:justify;}

运行范例 »

文本修饰

CSS text-decoration 属性用来设置或删除文本的装饰

从设计的角度看 text-decoration 属性主要是用来删除链接的下划线

a {text-decoration:none;}

运行范例 »

当然我们也可以装饰文字

h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}

运行范例 »

我们不建议强调指出不是链接的文本，因为这常常混淆用户

文本转换

CSS text-transform 属性用来设置在一个文本中的大写和小写字母

可用于所有字句变成大写或小写字母，或每个单词的首字母大写

p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}

运行范例 »

文本缩进

CSS text-indent 属性用于设置定文本的第一行的缩进

p {text-indent:50px;}

运行范例 »

更多范例

1. 指定字符之间的空间

   演示了如何增加或减少字符之间的空间。

2. 指定行与行之间的空间

   演示了如何指定在一个段落中行之间的空间

3. 设置元素的文本方向

   演示了如何改变元素的文本方向

4. 增加单词之间的空白空间

   演示了如何增加一个段落中的单词之间的空白空间。

5. 在元素内禁用文字环绕

   演示了如何禁用一个元素内的文字环绕

6. 垂直对齐图像

   演示了如何设置文本的垂直对齐图像

7. 添加文本阴影

   演示了如何设置文本阴影

CSS 文本属性

下表列出了所有的 CSS 文本属性