缩进和水平对齐

缩进

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产生的行间距就是增加或减少各行内框高度的因素之一。

垂直对齐文本

在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

处理空白符

值 pre-line normal nowrap pre pre-wrap
空白符合并合并合并保留保留
换行符保留忽略忽略保留保留
自动换行允许允许不允许不允许允许

CSS学习4（文本属性）