本教程通过视频讲解如何一步步构建一张DIV+CSS网页，当然是从一张完全空白的网页开始…教程中涉及的图片素材和最终效果仅作一个参考，是否能设计出更美观的作品就要依仗大家自身的平面设计功底了。在这里我就直接给出图片素材的压缩包，以及网页最终效果图：
>>>下载【朝花夕拾 – DIV+CSS布局实战系列视频教程】图片素材
第四集的重点主要是规划网页中左右分栏的主内容部分。把分栏的布局实现出来的方法有很多，我们这里讲解其中比较典型的一种，就是利用浮动属性来实现。
在未设定任何CSS的情况下DIV容器在浏览器中是没有任何外观视觉上的呈现的，所以为了更直观的进行布局规划，我们可以先为这些容器添加一些属性，来辅助我们观察它们在浏览器中的尺寸、位置等信息，以便我们进行深入的调整。可以用于辅助的属性有很多，应用最广泛的是边框和背景。
关于侧边栏的阴影背景，并不是一张图片简单的纵向平铺，在它的底部还有一个渐隐的效果。当然我们也不能仅用一张不平铺的大图来实现这个背景，因为它还要能根据侧边栏内容进行高度上的扩展。综合以上因素，我们可以考虑将这个背景划分成上下两块，上方部分用单像素高度的图片垂直平铺，而下方部分仅仅是一张不平铺的渐隐图片，这样一来就既能实现高度自适应，又能兼顾视觉效果上的完整。
视频录制分辨率为1024×768像素。
DIV+CSS布局实战系列视频教程【Part4 – WRF格式 – 14.24MB】
重传到了Freakshare网盘上，需要倒计时90秒才能下载，需要的朋友耐心点吧…记得安装仅2MB的用于播放WRF格式视频的WebEx播放器…