第2.3 网页设计基础ppt课件.ppt

《第2.3 网页设计基础ppt课件.ppt》由会员分享，可在线阅读，更多相关《第2.3 网页设计基础ppt课件.ppt（25页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、在此输入您的封面副标题第2.3 网页设计基础中国铁道出版社中国铁道出版社 2016.122016.12李红李红 岳云康岳云康 樊东燕樊东燕 编著编著 编著：编著：李红李红 岳云康岳云康 樊东燕樊东燕中国铁道出版社2016.9中国铁道出版社中国铁道出版社 2016.122016.12李红李红 岳云康岳云康 樊东燕樊东燕 编著编著 主讲：主讲： 李红李红第第2 2章章网页设计语言基础网页设计语言基础中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B HTML2.3 HTML语法语法本节主要内容：本节主要内容：2.3.1 HTML文档类型声明文档类型声明2.3.2 HTML文档的头部标

2、签文档的头部标签2.3.4 HTML文件命名规则文件命名规则2.3.3 HTML文档标签的使用规范文档标签的使用规范中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B HTML文档类型声明文档类型声明 1.什么是什么是文档类型声明文档类型声明？ HTML有多个不同的版本，只有完全明白页面中使用的确切HTML版本，浏览器才能完全正确地显示出HTML页面。这就是文档类型声明的用处。 文档类型声明不是一个HTML标签，它只是一个指令，它为浏览器提供一项信息（声明），告知浏览器当前页面是遵循哪种HTML是用什么版本编写的标记语言编写的。每个文档类型声明要引用一个DTD（Document

3、Type Definition，文档类型定义），DTD规定了标记语言的书写规则，浏览器根据这个规则正确呈现内容。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B W3C标准定义的文档类型标准定义的文档类型 （1）HTML 4.01严格版（严格版（Strict） （2）HTML 4.01过渡版（过渡版（Transitional） （1）HTML 4.01严格版（严格版（Strict） （2）HTML 4.01过渡版（过渡版（Transitional） （3）HTML 4.01框架集（框架集（Frameset） （4）XHTML 1.0严格版（严格版（Strict） （5）XHTM

4、L 1.0过渡版（过渡版（Transitional） （6）XHTML 1.0框架集（框架集（Frameset） （7）XHTML 1.1 （8）HTML 5中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B HTML5文档声明如下：这样这样HTML5文件基本结构如下：文件基本结构如下： 3. HTML5文档声明文档声明中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B XHTML文档声明如下文档声明如下： XHTML文件文档声明如下： 而且XHTML文档除了用声明类型，还需要为标签添加一个命名空间，这样XHTML文件的标签必须带xmlns属性，其方法如上。中国铁道

5、出版社电子商务网页设计（第2版）课件 2016.12 B HTML文档的头部标签文档的头部标签 在在. 定义的部分，通常叫定义的部分，通常叫“头部内容头部内容”。头部内容主要用来定义网页文档的基础信息，如文档标。头部内容主要用来定义网页文档的基础信息，如文档标题、说明信息、样式定义、脚本代码等。题、说明信息、样式定义、脚本代码等。 在头部内容通常可以应用在头部内容通常可以应用、等标等标签，签，、等标签也写在头部。等标签也写在头部。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 标签 title标签用来给标签用来给HTML文件添加标题。这个标签位于文件添加标题。这个标签位于与与

6、圈定的范围内。圈定的范围内。 在这里指定的标题除了可以在通常的浏览器窗口的标题栏在这里指定的标题除了可以在通常的浏览器窗口的标题栏中显示以外，还可以作为加入收藏夹时的标题。中显示以外，还可以作为加入收藏夹时的标题。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 标签 meta是是html语言语言head区的一个辅助性标签，其作用是提区的一个辅助性标签，其作用是提供文档的元信息，用来提供与浏览器或者搜索引擎相关的供文档的元信息，用来提供与浏览器或者搜索引擎相关的信息，定义页面使用语言编码，自动刷新并指向新的页面信息，定义页面使用语言编码，自动刷新并指向新的页面，控制页面缓冲，网

7、页文档的内容描述，控制网页显示的，控制页面缓冲，网页文档的内容描述，控制网页显示的窗口等。窗口等。HTML文件头部可以有多个文件头部可以有多个标签，标签，标签是单标记，标签必须被正确地关闭。标签是单标记，标签必须被正确地关闭。 meta标签主要有两个属性，它们分别是标签主要有两个属性，它们分别是http-equiv属性和属性和name属性，不同的属性又有不同的参数值，这些不同的属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能。参数值就实现了不同的网页功能。 标签的属性如表标签的属性如表2-1。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 标签标签提供

8、网页的相关信息，如：关提供网页的相关信息，如：关键字、作者、描述、网页过渡时间等多种信息。键字、作者、描述、网页过渡时间等多种信息。标记描述HTTP-EQUIVHTTP-EQUIV向服务器请求NAMENAME设置属性值CONTENTCONTENT根据搭配的属性设置对应的属性值中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 设置网页编码设置网页编码文档类型文档类型编码类型编码类型常用编码类型：常用编码类型： GB2312 - 简体中文简体中文 utf-8目前html5文本的中文编码” BIG5 - 繁体中文繁体中文中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B

9、 便于搜索引擎搜索网页，关键字之间要用逗号便于搜索引擎搜索网页，关键字之间要用逗号分割。分割。 关键字内容关键字内容关键字关键字中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 每隔几秒钟后刷新页面内容每隔几秒钟后刷新页面内容 刷新刷新刷新间隔的秒数刷新间隔的秒数中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 设定跳转时间和地址设定跳转时间和地址 跳转后打开的文件地址跳转后打开的文件地址中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 标签 标签可以设定标签可以设定URL地址，一般常用来设定浏览器地址，一般常用来设定浏览器中文件的绝对路径，然后

10、在文件中只需写下文件的相对位中文件的绝对路径，然后在文件中只需写下文件的相对位置，在浏览器中浏览时这些位置会自动附载绝对路径后面置，在浏览器中浏览时这些位置会自动附载绝对路径后面，成为完整的路径。，成为完整的路径。 一篇网页文档中一篇网页文档中标签不能多于一个，必须放于头标签不能多于一个，必须放于头部，并且应该在任何包含部，并且应该在任何包含URL地址的语句之前。地址的语句之前。 标签语法格式为：标签语法格式为：中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B base用来设定浏览器中文件的绝对路径，然后在文件中只需写下文件的相对位置，在浏览器中浏览时这些位置会自动附载绝对路径

11、后面，成为完整的路径。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 在在HTML文档头部除了使用文档头部除了使用、等等标签外，还有标签外，还有、标签也是写在标签也是写在头部的标签。头部的标签。 注意：注意：主体内容的标签一般不能写在这里。主体内容的标签一般不能写在这里。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B HTML文件命名规则文件命名规则 （1）静态网页文件扩展名用）静态网页文件扩展名用.html。索引文件统一使用。索引文件统一使用index.html文件名文件名(小写小写)。 （2）网页文件名以字母开头，通常使用字母（）网页文件名以字母开头，通

12、常使用字母（a-z）、数）、数字（字（0-9）、下划线（）、下划线（_）的组合；不要使用特殊字符，如）的组合；不要使用特殊字符，如空格、加号（空格、加号（+ ）、句点（）、句点（.）、或）、或$等；最好不要以数等；最好不要以数字开始。字开始。 （3）网页文件名尽量使用小写，大多数）网页文件名尽量使用小写，大多数Web服务器操作服务器操作系统是大小写敏感的。系统是大小写敏感的。 （4）网页文件名尽量语义化以便于阅读和理解；尽量短）网页文件名尽量语义化以便于阅读和理解；尽量短，最长不超，最长不超30个字符。个字符。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B HTML主体内容的

13、标签 写在写在 与与标记之间，显示在浏览器的正文标记之间，显示在浏览器的正文部分部分 如：前面学过的、等 HTML5和和 XHTML标签的使用规范如下：标签的使用规范如下：2.3.2 HTML5和和 XHTML标签的使用规范标签的使用规范中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 本节主要介绍html文档头部标签的主要内容。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B 实验实验3：html其他标记练习其他标记练习 实验目的：实验目的： 1.掌握掌握html语言头部标签的使用规范。语言头部标签的使用规范。 2.了解了解html语言语言head中包含的标签及其属性和值。中包含的标签及其属性和值。 3. 掌握掌握html文档中音频和视频标签的使用。文档中音频和视频标签的使用。 实验内容：实验内容： 1. 编写编写html5文档文件声明。文档文件声明。 2. 标签标签http-equiv 属性的使用。属性的使用。 3. 表格标签的使用。表格标签的使用。 4. 列表标签的使用。列表标签的使用。 5. 音频、视频标签的使用音频、视频标签的使用 6. HTML注释的使用。注释的使用。中国铁道出版社电子商务网页设计（第2版）课件 2016.12 B http:/