关于CSS三列Float布局任务

任务目标

• 掌握HTML/CSS布局的概念
• 掌握盒模型的概念
• 掌握position与float的概念以及在布局时的用法

任务描述

• 使用 HTML 与 CSS 按照示意图;实现三栏式布局。
• 左右两栏宽度固定，中间一栏根据父元素宽度填充满，最外面的框应理解为浏览器。背景色为 #eee 区域的高度取决于三个子元素中最高的高度。

任务注意事项

• 尝试 position 和 float 的效果，思考它们的异同和应用场景。
• 改变中间一栏的内容长度，以确保在中间一栏较高和右边一栏较高时，父元素的高度始终为子元素中最高的高度。

个人心得体会：        、

1. 当子DIV中含有绝对属性时，因为脱离了文档流，无法做到父元素高度随子元素最大高度变化而变化；
2. DIV_LEFT设置左浮动，DIV_RIGHT设置右浮动，再设置CENTER段落，会自动填充到中间列；
3. 关于父DIV随子DIV中的最大高度变化，给父元素属性中添加 overflow:hidden；属性