标签：
写在最前面：本文适合从Flex程序员转型为Web程序员的朋友观看
Flex4中的页面布局相当直观，如水平定位的HGroup（Flex3中的HBox），垂直定位的VGroup（Flex3中的VBox），绝对定位的Group（Flex3中的Canvas）。
但是当我转型到Web程序员，用Html+CSS布局页面的时候就搞得一头雾水，什么Div，什么float，什么position="relative"又是个什么gui！由于博主刚从Flex转型过来怀有抵触情绪，心浮气躁不愿意好好研究，所以都是拿Bootstrap里的Grid控件来应付一下（别说这个Grid还蛮好用的），不过有些对布局要求比较高的地方要修改Grid的原始CSS比较麻烦，后来博主发现还是索性用原生的Div+CSS布局来的方便。随着项目的深入博主也渐渐爱上了Web开发今天就耐下性子写了几个demo来加强记忆吧！
准备工作：
干净index.html一份，用于颜色分辨的css2个
<html> <head> <title>Hello Html</title> </head> <style> .redRect{ border: 1px solid #ff0000; } .blueRect{ border: 1px solid #0000ff; } </style> <body> </body> </html>
先来看看Div这货是怎么工作的
1：什么都不设置，Div默认状态如下
<body> <div class="redRect"></div> </body>
标签：
原文地址：http://www.cnblogs.com/momoko8443/p/4302879.html
