css : 标准文档流

宏观的讲，web页面的制作，是个“流”，必须从上而下，像“织毛衣”。

1 块级元素和行内元素

标准文档流等级森严,标签分为两种等级： 块级元素（会自动换行）：<h1>-<h6>、<p>.<ul><li><ol><dl><div>、<table> 、<tr> 行内元素（不会换行）：<img>.<label>.<input> .<span>. <td>、<a>

1） 块级元素 容器级 ● 霸占一行，不能与其他任何元素并列 ● 能接受宽、高 ● 如果不设置宽度，那么宽度将默认变为父亲的100%。

2） 行内元素 ● 与其他行内元素并排 ● 不能设置宽、高。默认的宽度，就是文字的宽度。 文本级：p、span、a、b、i、u、em 容器级：div、h系列、li、dt、dd

CSS的分类和上面的很像，就p不一样： 所有的文本级标签，都是行内元素，除了p，p是个文本级，但是是个块级元素。 所有的容器级标签都是块级元素。

2 块级元素和行内元素的相互转换 display 块级元素可以设置为行内元素 行内元素可以设置为块级元素

display是“显示模式”的意思，用来改变元素的行内、块级性质 display: inline; 那么，这个标签将立即变为行内元素。此时它和一个span无异： ● 此时这个div不能设置宽度、高度； ● 此时这个div可以和别人并排了

Display:block: “block”是“块”的意思 让标签变为块级元素。此时这个标签，和一个div无异： ● 此时这个span能够设置宽度、高度 ● 此时这个span必须霸占一行了，别人无法和他并排 ● 如果不设置宽度，将撑满父亲

css中一共有三种手段，使一个元素脱离标准文档流： 1） 浮动 2） 绝对定位 3） 固定定位