CSS学习4（文本属性）

缩进和水平对齐

缩进

text-indent：length | percentage | inherit

将Web页面上一个段落的第一行缩进，用于块级元素。

水平对齐

text-align：left | center | right | justify | inherit

用于块级元素

justify是两端对齐文本，它将使文本行的两端都放在父元素的边界上，调整字符间距，使每行一样长。

这个只会控制块级元素中的行内元素，要将块级元素或表元素居中，要通过在这些元素上适当地设置左、右外边距来实现。

垂直对齐

行高

line-height属性是指文本行基线之间的距离，而不是字体的大小，它确定了将各个元素框的高度增加或减少多少。

line-height控制了行间距，这是文本行之间超出字体大小的额外空间。换句话说，line-height值和字体大小之差就是行间距。

值：（length） | （percentage）| （number）| normal | inherit

其中百分比是相对于元素的字体大小而言的。

当一个块级元素从另一个元素继承line-height时，问题会变得更为复杂。line-height值从父元素继承时，要从父元素计算，而不是在子元

素上计算。这种情况会发生在父元素的line-height是em，percentage等值时。两种结局办法，一种是为每个元素都写line-height，不使用继承。另一种指定数字值，这个值将是一个相对font-size的缩放因子，这个值会直接继承而不是继承计算值。

#div4{
font-size: 20px;
//line-height:1em;
line-height:1;
p{
text-indent: 1.5em;
text-align: center;
font-size: 30px;
//when div4's line-height is 1em, here we seem to inherit 1em. But actually, we inherit a computed value from div4 which is 20px
//when div4 line-height is 1, we inherit 1,and compute it here using self's font-size.
line-height:inherit;
}

}

构造文本行

文本行中的每个元素都会生成一个内容区，这由字体的大小确定。这个内容区则会生成一个行内框(inline box)，如果不存在其他因素，这

个行内框就完全等于该元素的内容区，由line-height产生的行间距就是增加或减少各行内框高度的因素之一。

垂直对齐文本

vertical-align

baseline | sub | super | top | text-top | middle | bottom | text-bottom | （percentage） | （length） | inherit

在CSS中，vertical-align属性只应用于行内元素和替换元素，如图像和表单输入元素。vertical-align属性不能继承。

vertical-align不影响块级元素中内容的对齐。不过，可以用它来影响表单元格中元素的垂直对齐。

字间隔和字母间隔

字间隔

word-spacing：（length）| normal | inherit

这个只对英文管用，词之间的距离。

字母间隔

letter-spacing：（length） | normal | inherit

文本转换

text-transform：uppercase | lowercase | capitalize | none | inherit

文本装饰

text-decoration：none | [underline || overline || line-through || blink] | inherit

处理空白符

white-space：normal | nowrap | pre | pre-wrap | pre-line | inherit

使用这个属性，可以影响浏览器处理字之间和文本行之间的空白符的方式。从某种程度上讲，默认的XHTML处理已经完成了空白符处理：它会把所有空白符合并为一个空格。所以在Web浏览器中显示时，各个字之间只会显示一个空格，而且忽略元素中的换行。

如果white-space为pre，则不会忽略元素中的换行和空格。

与之相对的值是nowrap，它会防止元素中的文本换行，除非使用了一个br元素。

值 pre-line normal nowrap pre pre-wrap

空白符 合并 合并 合并 保留 保留

换行符 保留 忽略 忽略 保留 保留

自动换行 允许 允许 不允许 不允许 允许