CSS DIV布局：掌握网页框架与图文布局

本资源主要讲解了HTML/CSS在网页布局中的应用，特别是DIV布局技术。首先，我们回顾了一些基本概念，包括类选择器、标签选择器和ID选择器的应用场景，以及超链接的四种伪类。CSS样式表的三种应用方式也有所提及，即内联样式、内部样式表（style标签）和外部样式表（link标签）。 章节重点在于DIV布局技术的实践，通过`<div>`元素来实现网页的整体布局。代码示例展示了如何创建具有明确宽度和定位的三个主要区域：`#middle`（中间内容区，宽800px）、`#sidebar`（侧边栏，宽198px，浮动并设置背景色）和`#content`（主要内容区，宽600px，浮动并设置背景色）。这些`<div>`元素通过`float`属性配合`margin`和`clear`属性，实现了灵活的页面布局。 框架是另一个重要的布局工具，它用于将页面划分为多个独立的窗口，每个窗口可以加载不同的HTML文件。通过`<frameset>`标签，开发者可以指定窗口的边框大小、列宽和行高，以及各个窗口对应的HTML源文件。例如，`<frameset cols="25%,50%,*" rows="50%,*">`定义了一个三列两行的框架布局，允许设置不同窗口的尺寸比例。 在框架的使用中，页面被分为几个固定的部分，如广告栏、导航栏和详细内容区，每个部分在不同的框架中显示，且内容可以根据需要动态改变。例如，`<frame name="top" src="the_first.html">`定义了顶部窗口的内容来源。 最后，资源还探讨了如何创建更复杂的窗口布局，如将一个窗口分为上下两部分，再将下部分进一步分为左右两部分，这需要结合CSS和HTML的细致调整来完成。 本资源深入讲解了HTML和CSS在网页布局中的基础和进阶技巧，帮助读者掌握如何利用DIV和框架技术创建专业级的网页布局。