《HTML5+CSS3网页制作教程》课件_第2章.pptx

模块2编写第一个HTML页面;

2.1HTML基本语法

;

2.1.2?元素

HTML文档是由HTML元素定义的。HTML元素定义了HTML文档通过浏览器所要呈现的内容。一般的HTML元素是指从开始标签到结束标签的所有代码。

HTML元素语法如下：

(1)HTML元素以开始标签起始，以结束标签终止；

(2)元素的内容是开始标签与结束标签之间的内容，如图2-1所示；

(3)某些HTML元素具有空内容；

(4)空元素在开始标签中进行关闭，如换行标签br、分割线标签hr；

(5)大多数HTML元素可拥有属性。

;

;

【例2-1】定义一个元素。

!doctypehtml

html

head

metacharset=utf-8

title例2-1/title

/head

body

p这是一个段落。/p

/body

/html

;

这里的p元素定义了HTML文档中的一个段落。这个元素从开始标签p开始，至结束标签/p结束，元素的内容是“这是一个段落。”。

;

2.1.3?属性

HTML的元素属性用于为其提供附加信息。例如，希望段落文本居中对齐时，就可以添加align属性，并设置值为center。

属性总是以名称/值对的形式出现，例如：name=value。另外，属性总是在HTML元素的开始标签中定义。

在HTML元素中定义一个属性的格式如下：

标签名属性1=属性值1属性2=属性值2…内容/标签名

;

【例2-2】为元素定义一个属性。

;

这里为标题标签h1添加了对齐属性align，并设置属性值为center，标题内的文本“标题一”在浏览器中显示为居中对齐。

一个HTML元素可以定义多个属性，例如：

h1id=id1class=class1align=center

其中，每个名称/值对用空格隔开就可以。

;

2.1.4?注释

在编写HTML代码时，为了方便自己和他??阅读和理解关键代码，有时需要为代码添加一些说明文字，但是这些说明文字不需要显示在浏览器页面中，这时就需要添加注释。

在HTML文件中定义注释的格式如下：

!--注释的内容--

其中，标签“!--”与“--”用于在HTML插入注释。

;

【例2-3】注释的使用。;

注意：注释的内容是不显示在浏览器中的。我们可以利用注释在HTML中放置通知和提醒信息，也为了代码的可读、易懂，大家要养成良好的代码注释习惯。

;

2.2HTML基本结构

;

【例2-4】HTML文档基本结构。

;

一个完整的HTML文档至少由以下四部分组成。

(1)文档声明：!DOCTYPEhtml；

(2)html标签对：html/html；

(3)head标签对：head/head；

(4)body标签对：body/body。

;

2.2.2?文档声明

一个HTML文档的开始是对文档进行声明，使用!DOCTYPEhtml声明文档为HTML文档。

HTML文档是用浏览器解释的，声明有助于浏览器正确显示网页。网络上有很多不同的文件，正确声明HTML的版本，浏览器能正确显示网页内容。

声明是不区分大小写的。

;

2.2.3?html标签

html标签位于文档声明!DOCTYPEhtml之后，也称为根标签。html与/html标签限定了文档的开始点和结束点，在它们之间是文档的页头和页身。一个HTML页面的基本结构定义如下：

;

2.2.4?head标签

head标签定义了页面的头部，即页头。在head/head标签对内部只能定义一些特殊的内容，这些内容在浏览器页面中是不显示的。

1.title标签

在HTML中，title标签只是用来定义网页标题的。这个标题是在浏览器工具栏中的标题，如图2-3所示，在每个图标后面的标题，如“百度一下，你就知道”“爱淘宝PC新版”等就是每个网页对应的标题，title标签除了定义网页标题外，还可以提供页面被添加到收藏夹时显示的标题，以及在搜索引擎结果中显示的页面标题。

;

;

定义标题的语法如下：

head

title……/title

/head

网页的标题内容，都是在title/title标签内定义的。

;

2.meta标签

me