Web前端设计—HTML和CSS开发实战-教案-第6章

1第 6 章 DIV 布局背诵英语单词structurepresentationpaddingbehaviorborder-rightbordermargin学习目标DIV+CSS 是现在最流行的一种网页布局格式，以前常用布局表格来布局，而现在一些比较知名的网页设计全部采用 DIV+CSS。它的优点在于可以使 HTML 代码更整齐，更容易使人理解，而且在浏览时的速度也比传统的布局方式快，最重要的是他的可控性要比布局表格强得多。内容导航◊表单标记◊插入表单对象◊菜单和列表◊文本域标记◊id 标记6.1Web 标准与 CSS 布局Web 标 准 是 网 站 开 发 中 一 系 列 标 准 的 集 合 ， 包 括 XHTML 、 XML 、 CSS 、 DOM 和ECMAScript 等。指定这些标准是为了便于维护，代码更简洁，降低带宽的运行成本，更容易被搜索引擎搜索到，改版方便，不需要变动页面内容，提高网站易用性等。26.1.1 什么是 Web 标准Web 标准是由 W3C 和其它标准化组织制定的一套规范集合,eb 标准的目的在于创建一个统一的用于 Web 表现层的技术标准，以便通过不同的浏览器或终端设备向最终用户展示信息内容。Web 标准由一系列规范组成，目前的 Web 标准主要由三大部分组成：结构(Struetu)、表现 Presentati)n 行为 Behavio)。真正符合 Web 标准的网页设计是指能够灵活使用 b 标准对 Web 内容进行结构、表现与行为的分离。1. 结构(Strueture)结构用于对网页中用到的信息进行分类与整理。在结构中用到的技术主要包括HTML、XML 和 XHTML。2. 表现(Presentation)表现用语言对信息进行版式、颜色、大小等形式的控制。在表现中用到的技术主要是 CSS 层叠样式表。3. 行为(Behavior)行为是指文档内部的模型定义即交互行为的编写，用于编写交互式的文档。在行为中主要用到的技术主要包括 DOM 和 ECMASeript。DOM(DocumentObjectModel)文档对象模型：DOM 是浏览器与内容结构之间沟通的接口，使浏览者可以访问页面上的标准组件。ECMASeript 脚本语言：ECMASeript 是标准脚本语言，用于实现具体界面上对象的交互操作。6.1.2CSS 布局的优势掌握基于 CSS 的网页布局方式，是实现 Web 标准的基础。在制作主页时采用 CSS 技术，可以有效的对待页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。只要对相应的代码做一些简单的修改，就可以改变网页的外观和格式。采用 CSS 布局有以下优点：1. 大大缩减页面代码，提高页面浏览速度2. 结构清晰，容易被搜索引擎...