前端网页设计(高职高专)
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
严格型(Strict)：表示要求严格的DTD文档，需要干净的标记，标记中
不能使用任何描述性的元素和属性，避免表现上的混乱，与层叠样式表配合使用。 完整代码如下：
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1strict.dtd”>
2、表现标准语言
在网页中主要对网页信息的显示进行控制，即 如何修饰网页信息的显示样式 CSS (Cascading Style Sheets，层叠式样式表)， W3C于1998年5月12日发布的CSS2，创 建的目的就是使用CSS取代HTML中结构与 表现混淆的弊端，使站点访问与维护更加容易
3、行为标准语言
分发本次课所用文件
项目准备-任务2(任务实施过程).doc 项目准备-任务2(任务实施总结).doc 项目准备-任务3–子任务1--任务实施准备.doc
知识点：(一)概念(2个)
(1)W3C组织:(World Wide Web Consortium, 万维网联盟)
是一个专门负责网络标准制定的非赢利组织,诸如HTML、 XHTML、CSS、XML等标准都是W3C制定的。 2. W3C会员包括生产技术产品及服务的厂商、内容供应商、
知识点：(四)Web标准布局与传统表格布局的对比
看下面实例：三行三列表格布局网页
Web标准布局与传统表格布局的对比
表格布局(源文件)
标准布局(源文件)
知识点：(五)XHTML页面结构
XHTML与HTML文档页面没有太大区别，但增加 了XML语言的基本规范和要求：
参看下列标准XHTML网页文档结构：
Document Object Model文档对象模 型:浏览器与网页内容结构之间的接口， 使用户可以访问页面上的标准组件
脚本语言，用于实现具体界面上对象 的交互操作
欧洲电脑厂商协会(European Computer Manufacturers Association)
Fra Baidu bibliotek 1、结构标准语言
在网页中主要对网页信息起到组织和分类的作用：
框架型(Frameset)：针对框架页面设计使用的DTD文档，如果是
框架网页或网页中包含框架，则采用这种DTD。完整代码如下：
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD /xhtml1-frameset.dtd”>
知识点：(六)XHTML常用元素简介
(1) div (division,分隔)
通用块状元素，在标准网页布局中最常用的结 构化元素。表示文档结构块，可以把文档分割 为多个区域。
(1) XHTML (The Extensible HyperText Markup Language， 可扩展超文本标记语言)。W3C于2000年1月20日推出 XHTML1.0版本。
(2) XML (The Extensible Markup Language，可扩展标记语 言)，W3C于1998年2月10日发布XML1.0，于2000年10月6 日发布XML1.0(SE)第2版。 逐渐用于网络 是一种能定义其他语言的语言，最初设计的目的是弥补HTML的不足，以强大的扩展性满足网络信息发布的需要， 数据交换标准的格式
在网页中主要对网页信息的结构和显示进行逻辑 控制，即动态控制网页信息的结构和显示，实现 网页的交互。
(1) DOM (Document Object Model，文档对象模型)。是 一种让浏览器与网页内容沟通的语言，使得用户可以 访问页面元素和组件。给Web设计师和设计者一个标 准的方法，让他们来访问站点中的数据、脚本和表现 层对象
几种 ？
XHTML提供三种DTD文档类型
过渡型(Transitional):表示要求非常宽松的DTD文档，允许使用
HTML元素，但要符合XHTML的语法要求，此格式完整代码如下：
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” ”http://www.w3.org/TR/xhtml1/DTD /xhtml1-transitional.dtd”>
团体拥护、研究实验室、标准制定机构和政府部门，会 员一起协同工作，致力在万维网发展方向上达成共识。
(2)Web标准
是由W3C和其他标准化组织制定的一套 规范集合;
目的是创建一个统一的用于Web表现层的 技术标准;
通过不同浏览器或终端设备向最终用户展 示信息内容。
提问
知识点：(二)Web标准由3大部分组成
(2) ECMAScript，由ECMA指定的标准脚本语言
欧洲电脑厂商协会
知识点：(三)Web标准布局的使用
Web标准在国内应用逐渐普及，它不是某 一个标准，而是一系列标准的集合。
提问
国内第一个使用Web标准布局的网站： 闪客帝国(http://www.flashempire.com)， 2004年10月开 始使用Web标准对网站进行改版重构，于 2005年完成全部CSS布局。
结构(Structure)：对网页中用到的信息进行分类与整理
表现(Presentation)：对信息进行版式、颜色、大小等形式控制
行为(Behavior)：文档内部的模型定义及交互行为的编写
对应的标准语言也分三方面：
结构化标准语言(HTML、XHTML和XML) 表现标准语言(CSS) 行为标准(对象模型:W3CDOM、ECMAScript)
书名：前端网页设计 ISBN： 978-7-111-44372-8 作者：杜黎强 出版社：机械工业出版社 本书配有电子课件
第2次课教学内容及实施环节
项目准备：任务2 应用web2.0标准区分HTML与XHTML文档 教学导入
第1次课教学回顾
教学实施
任务实施准备页检查 知识点讲解 任务实施 请大家完成本次课课中页：任务2-实施过程.doc
不能使用任何描述性的元素和属性，避免表现上的混乱，与层叠样式表配合使用。 完整代码如下：
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1strict.dtd”>
2、表现标准语言
在网页中主要对网页信息的显示进行控制，即 如何修饰网页信息的显示样式 CSS (Cascading Style Sheets，层叠式样式表)， W3C于1998年5月12日发布的CSS2，创 建的目的就是使用CSS取代HTML中结构与 表现混淆的弊端，使站点访问与维护更加容易
3、行为标准语言
分发本次课所用文件
项目准备-任务2(任务实施过程).doc 项目准备-任务2(任务实施总结).doc 项目准备-任务3–子任务1--任务实施准备.doc
知识点：(一)概念(2个)
(1)W3C组织:(World Wide Web Consortium, 万维网联盟)
是一个专门负责网络标准制定的非赢利组织,诸如HTML、 XHTML、CSS、XML等标准都是W3C制定的。 2. W3C会员包括生产技术产品及服务的厂商、内容供应商、
知识点：(四)Web标准布局与传统表格布局的对比
看下面实例：三行三列表格布局网页
Web标准布局与传统表格布局的对比
表格布局(源文件)
标准布局(源文件)
知识点：(五)XHTML页面结构
XHTML与HTML文档页面没有太大区别，但增加 了XML语言的基本规范和要求：
参看下列标准XHTML网页文档结构：
Document Object Model文档对象模 型:浏览器与网页内容结构之间的接口， 使用户可以访问页面上的标准组件
脚本语言，用于实现具体界面上对象 的交互操作
欧洲电脑厂商协会(European Computer Manufacturers Association)
Fra Baidu bibliotek 1、结构标准语言
在网页中主要对网页信息起到组织和分类的作用：
框架型(Frameset)：针对框架页面设计使用的DTD文档，如果是
框架网页或网页中包含框架，则采用这种DTD。完整代码如下：
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD /xhtml1-frameset.dtd”>
知识点：(六)XHTML常用元素简介
(1) div (division,分隔)
通用块状元素，在标准网页布局中最常用的结 构化元素。表示文档结构块，可以把文档分割 为多个区域。
(1) XHTML (The Extensible HyperText Markup Language， 可扩展超文本标记语言)。W3C于2000年1月20日推出 XHTML1.0版本。
(2) XML (The Extensible Markup Language，可扩展标记语 言)，W3C于1998年2月10日发布XML1.0，于2000年10月6 日发布XML1.0(SE)第2版。 逐渐用于网络 是一种能定义其他语言的语言，最初设计的目的是弥补HTML的不足，以强大的扩展性满足网络信息发布的需要， 数据交换标准的格式
在网页中主要对网页信息的结构和显示进行逻辑 控制，即动态控制网页信息的结构和显示，实现 网页的交互。
(1) DOM (Document Object Model，文档对象模型)。是 一种让浏览器与网页内容沟通的语言，使得用户可以 访问页面元素和组件。给Web设计师和设计者一个标 准的方法，让他们来访问站点中的数据、脚本和表现 层对象
几种 ？
XHTML提供三种DTD文档类型
过渡型(Transitional):表示要求非常宽松的DTD文档，允许使用
HTML元素，但要符合XHTML的语法要求，此格式完整代码如下：
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” ”http://www.w3.org/TR/xhtml1/DTD /xhtml1-transitional.dtd”>
团体拥护、研究实验室、标准制定机构和政府部门，会 员一起协同工作，致力在万维网发展方向上达成共识。
(2)Web标准
是由W3C和其他标准化组织制定的一套 规范集合;
目的是创建一个统一的用于Web表现层的 技术标准;
通过不同浏览器或终端设备向最终用户展 示信息内容。
提问
知识点：(二)Web标准由3大部分组成
(2) ECMAScript，由ECMA指定的标准脚本语言
欧洲电脑厂商协会
知识点：(三)Web标准布局的使用
Web标准在国内应用逐渐普及，它不是某 一个标准，而是一系列标准的集合。
提问
国内第一个使用Web标准布局的网站： 闪客帝国(http://www.flashempire.com)， 2004年10月开 始使用Web标准对网站进行改版重构，于 2005年完成全部CSS布局。
结构(Structure)：对网页中用到的信息进行分类与整理
表现(Presentation)：对信息进行版式、颜色、大小等形式控制
行为(Behavior)：文档内部的模型定义及交互行为的编写
对应的标准语言也分三方面：
结构化标准语言(HTML、XHTML和XML) 表现标准语言(CSS) 行为标准(对象模型:W3CDOM、ECMAScript)
书名：前端网页设计 ISBN： 978-7-111-44372-8 作者：杜黎强 出版社：机械工业出版社 本书配有电子课件
第2次课教学内容及实施环节
项目准备：任务2 应用web2.0标准区分HTML与XHTML文档 教学导入
第1次课教学回顾
教学实施
任务实施准备页检查 知识点讲解 任务实施 请大家完成本次课课中页：任务2-实施过程.doc