HTML5布局之路 文本与特殊布局

一、文本：
背景：background，复合写法，类似于border，可以同时设置颜色、图片、重复、定位、关联（滚动）等。
默认情况下背景会横纵重复。

透明：兼容写法：
{
filter: alpha(opacity = 50);
opacity: 0.5;
}
透明度会影响后代。可以通过z-index来解决。
还可以通过rgba控制透明度。

段落：
line-height: 行间距
text-decoration：文本修饰，如underline下划线
text-indent：首行文本缩进，用em好一点
text-align：水平对齐方式
vertical-align：垂直（有bug，不建议使用）
那么如何居中呢？ 用定位。

word/letter-spacing：间距，单词和字母
word-break：自动换行，break-all允许单词内换行

字体样式：
color
font-family：字体系列
font-size：大小
font-style：倾斜
font-weight：粗细
font复合样式，一般不使用

网络字体：用@font-face，先字体系列，然后src

二、定位布局

当页面中出现多个元素层叠状态的时候，用定位布局。

定位：position
static 默认值
fixed 相对于浏览器布局
relative 相对于自己本来的位置进行定位，通常用来作为绝对定位的容器
absolu 绝对定位，父元素有定位过的就以最近的去定位，否则以html标签进行定位，会收到父元素padding的影响

都需要left top right bottom进行激活。

相对定位的元素不会脱离文档流。绝对定位的元素会脱离文档流。当元素脱离文档流就可以为元素设置盒模型属性，但是margin属性中的auto会失效。

z-index越大，越在上面。

界限控制：max/min-height/width
伪元素：：：before，：：after，内容可以用content属性。