任务目标
- 掌握HTML/CSS布局的概念
- 掌握盒模型的概念
- 掌握position与float的概念以及在布局时的用法
任务描述
- 使用 HTML 与 CSS 按照示意图;实现三栏式布局。
- 左右两栏宽度固定，中间一栏根据父元素宽度填充满，最外面的框应理解为浏览器。背景色为 #eee 区域的高度取决于三个子元素中最高的高度。
任务注意事项
- 尝试 position 和 float 的效果，思考它们的异同和应用场景。
- 改变中间一栏的内容长度，以确保在中间一栏较高和右边一栏较高时，父元素的高度始终为子元素中最高的高度。
个人心得体会： 、
- 当子DIV中含有绝对属性时，因为脱离了文档流，无法做到父元素高度随子元素最大高度变化而变化；
- DIV_LEFT设置左浮动，DIV_RIGHT设置右浮动，再设置CENTER段落，会自动填充到中间列；
- 关于父DIV随子DIV中的最大高度变化，给父元素属性中添加 overflow:hidden；属性