HTML三种布局方式总结
1 普通流
又称为常规流，浏览器默认的排版方式。普通流是元素在多数情况下呈现在WEB页面上的方式。所有HTML都在块框(block boxes，块级元素)或者行内框(inline boxes，行内元素)中。当浏览器开始渲染HTML文档，它从窗口的顶端开始，经过整个文档内容的过程中，分配元素需要的空间。除非文档的尺寸被 CSS 特别的限定，否则浏览器垂直扩展文档来容纳全部的内容。每个新的块级元素渲染为新行。行内元素（行内元素/行内块级）则按照顺序被水平渲染直到当前行遇到了边界，然后换到下一行垂直渲染。
2 定位流
1> absolute，绝对定位：绝对定位的元素位置是相对于距离它最近的那个已定位（定位流）的祖先(相对/绝对/固定)元素决定的。 如果元素没有已定位的祖先元素， 那么它的位置相对于初始包含块（body）进行定位。
2> fixed，固定定位：固定定位可以理解为是绝对定位的一种。固定定位的元素位置是相对于浏览器窗口决定的。这使得能够创建总是出现在窗口固定位置的元素。
3> inherit，继承：继承父元素position属性的值。
4> relative，相对定位：相对定位就是相对于自己以前在普通流中的位置来移动。即相对于其正常位置进行定位。
5> static，静态定位：默认值，没有定位，元素出现在正常的流中，即上面的普通流，忽略 top, bottom, left, right 或者 z-index 声明。
3 浮动流
浮动流只有一种排版方式, 就是水平排版. 它只能设置某个元素左对齐或者右对齐。先浮动的元素会显示在前面, 后浮动的元素会显示在后面。
1> inherit，继承：继承父元素float属性的值。
2> left，左浮动：元素向左浮动。先浮动的在左边，后浮动的在右边。
3> none，不浮动：默认值。
4> right，右浮动：元素向右浮动。先浮动的在右边，后浮动的在左边。
以上就是HTML网页布局方式有哪些的详细内容，更多请关注Work网其它相关文章！