《网页设计与制作应用教程》课件——CH2 HTML5 基础 .pptxVIP

第3版HTML5DreamweaverPhotoshopCSS3AnimateAdobeCC网页设计与制作应用教程

网页设计与制作第2章HTML5

本章重点代码规范语法结构标签与属性

二、HTML5基础网页设计与制作——HTML5基础2.1XHTML简介2.3HTML5语法2.4HTML5常用标签2.2创建简单的网页文件2.5HTML5新标签

2.1XHTML简介HTML是HyperTextMarkupLanguage（超文本标记语言）的缩写，它是构成Web页面，表示Web页面的符号标记语言。1993年6月正式推出HTML1.0版，2014年10月，W3C发布了HTML5，从而，HTML5取代了HTML4.0和XHTML1.0标准，实现了桌面系统和移动平台的完美衔接。可以说HTML5是HTML的升级完善，它将Web带入一个成熟的应用平台，在这个平台上，视频、音频、图像、动画以及与设备的交互都进行了规范。XHTML的新特点功能兼容性增加了新特性内容与表现的分离简化HTML5新增了内容元素，HTML5新增了表单控件，HTML5新增了用于绘画的canvas元素。HTML5新增了用于媒体播放的video、audio元素。HTML5更好地支持了地理位置、拖曳、摄像头等API。XHTML的新特性网页设计与制作——HTML5基础

2.2创建简单网页文件网页设计与制作——HTML5基础创建一个简单的网页，可以通过网页编辑器来编辑网页、并保存，生成XHTML文件。打开记事本。单击Windows的“开始”按钮，在“程序”菜单的“附件”子菜单中单击“记事本”命令。创建新文件，并按XHTML语言规则编辑。在“记事本”窗口中输入XHTML代码，代码内容。保存网页。打开“记事本”的“文件”菜单，选择“保存”命令。此时将出现“另存为”对话框，在“保存在”下拉列表框中选择文件要存放的路径，在“文件名”文本框输入以“html（或htm）”为后缀的文件名，最后单击“保存”按钮，生成网页文档。在资源管理器窗口找到网页文档，双击文档图标，随即在打开的IE浏览器窗口中可以浏览到网页内容。

2.3HTML5语法网页设计与制作——HTML5基础XHTML代码规范所有的标记都必须有一个相应的结束标记所有标签的元素和属性的名字都必须使用小写所有的标记都必须合理嵌套所有的属性必须用引号括起来特殊符号“”、“”和“＆”用编码表示每个属性必须赋值

2.4HTML5常用标签网页设计与制作——HTML5基础2.4.1文档结构标签HTML5文档是一种纯文本格式的文件，HTML5文档的基本结构为文件头和文件主体部分。我们先看下面的源代码，方便理解文档结构中的标签作用。XHTML的基本结构XHTML文档是一种纯文本格式的文件，XHTML文档的基本结构为：!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//EN/TR/xhtml1/DTD/xhtml1-transitional.dtdhtmlxmlns=/1999/xhtmlheadmetahttp-equiv=Content-Typecontent=text/html;charset=gb2312/title我的网页标题/title/headbody网页内容/body/html

2.4HTML5常用标签网页设计与制作——HTML5基础2．XHTML文档标记html…/html3．XHTML文档头标记head…/head4．XHTML文档标题标记title＞标题内容…/title6．XHTML文档主体标记body网页内容…/…/body5．XHTML文档元信息标签metacharset=utf-8/1.!DOCTYPE!DOCTYPE位于文档的最前面，用于说明当前文档使用哪种HTML标准规范。head标签用于定义文档的头部，它是所有头部元素的容器用于提供有关页面的元信息用于定义文档的标题说明自身是一个HTML文档(1)主体位于头部之后，以body为开始标签，/body为结束标签。它定义网页上显示的主要内容与显示格式，是整个网页的核心，网页中要真正显示的内容都包含在主体中，如文本、超链接、图像、表格和列表等等。(2)body标签有很多“呈现属性”，用于呈现页面外观，如bgcolor、text、link、alink、vlink、background、leftmargin、topmargin等。2.4.1文档结构标签

2.4HTML5常用标签网页设计与制作——HTML5基础2.4.2文本格式标签1．！--…--注释标签