在Internet繁荣发展的早期，为了实现我想要的页面外观和行为，不得不编写一些“丑陋”的代码。我花费了大量时间去准备无数的图形文件，用他们创建鼠标特效和导航栏，结果却发现要通过一个28.8K的modem来下载它们需要的时间太长了。我希望哪天网络带宽能像流水一样通畅无阻，那样就能很快地下载页面。
更具讽刺意味的是，现在的带宽资源丰富了许多，但繁琐的图形编码却已经过时了。幸运的是，重叠样式表2（css2）让我们可以使用它的边框属性为需要图形的代码重新创建各种效果。
以前，为使页面布局合理准确，我花费大量的时间调整表格、分格GIF以及背景颜色。不幸的是，这样做的结果是最终代码经常不必要地膨胀起来。而且，一旦布局被编码，要想再改变它就很困难，同时还要花费许多时间。
使用css2，特别是它的边框属性，整个页面可以一个表格或分格GIF都不用。以Figure A中的页面布局为例。
我将从创建header区域开始。参看Listing A中的代码，作为演示它使用了内嵌的样式表。
这段代码创建了一个75px高、四周带有1px宽黑色边框的蓝色高亮区域。为了确保对三种主流浏览器的兼容性，并让布局配合浏览器窗口，我没有设置header的宽度属性。
下面是topnav区域。为创建这个区域，我更新代码为Listing B。
在header下面，有一个三边都带有1px大小黑色边框的深蓝色区域。我没有在topnav的顶部使用边框，因为已经使用了header底边边框来分隔这两个区域。与header一样，不指定topnav的宽度。
