网页制作 第二章 Html初识与深入1.ppt

1、 HTML语言概述 HTML 的基本工作原理 HTML的基本语法,第二章 HTML初识与深入1,HTML基本标记文件头标签，即标签 超级链接标记表格标记表单标记,HTML语言概述,HTML 不是程序设计语言，而是一种结构语言。 HTML 与平台无关，只要是相同的浏览器。 HTML有许多元素，元素标置即形成了所谓的HTML文档。 HTML 也是文本文件，所以可以用纯文本编辑器来编辑（如Windows 的记事本、写字板)。 其后缀名必须是 .html 或 .htm 。 只有通过浏览器才可以对HTML文档进行相应的解释。,超文本标记语言HTML（HyperText Markup Language）是

2、SGML（Standard Generalized Markup Language）语言的一个应用，是WWW“世界”的通用“语言”。 WWW“世界”诸服务器与浏览器之间通过它互相沟通，WWW“世界”中的信息可以通过它来“表现”。,HTML(Hypertext Markup Language) 是一种规范，一种标准，它通过标记符来标记要显示的网页的各个部分。通过在网页中添加标记符，可以告诉浏览器如何显示网页，即确定内容的格式。浏览器按顺序读取HTML文件，然后根据内容周围的HTML标记符解释和显示各种内容。,HTML 的基本工作原理,网页文档编辑窗口,元素：是HTML语言的基本部分。元素一般成对

3、出现，每一对元素一般都有一个开始的标记（如），也有一个结束的标记（如）。元素的标记要用一对尖括号括起来，并且结束的标记总是在开始的标记前加一个斜杠。 注:也有一些标记只要求单一标记符号，例如换行标记就是这样。,HTML 文件结构 (Document Structures),网页的标题 网页的内容，很多标记都作用于此。,HTML标记不区分大小写，但通常约定使用大写字母来表示，以利于HTML文档的维护。,一个基本的HTML文档通常包含以下三对顶级标记：,标记属性 HTML语言的的标记具有一定的属性。如：,内容注释 基本格式：这两个标记之间的文字被浏览器解释为注释，而不在浏览器窗口中显示。,HTML

4、的基本语法HTML 的主要语法是标记、标记属性和内容注释。标记 用于描述功能的符号。,标记表明HTML文档的主体部分。在与之间，通常都会有很多其它标记；这些标记和标记的属性构成HTML文档的主体部分。,(1)bgcolor bgcolor属性：标志HTML文档的背景颜色。 如：bgcolor=“#CCFFCC“。,HTML使用16进制的RGB颜色值对颜色进行控制。 16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f., 标记的属性,(2)background background属性：标志HTML文档的背景图片。如：background=“images/bg.

5、gif“。 可以使用的图片格式为GIF，JPG等,(4)Text text属性：标志HTML文档的正文文字颜色。 如：text=“#FF6666”。Text元素定义的颜色将应用于整篇文档。,(5)超级链接颜色 link、 alink 、vlink分别控制普通超级链接、当前活动超级链接颜色、访问过的超级链接。,(6) leftmargin和topmargin 设置网页主体内容距离网页顶端和左端的距离。如：leftmargin=“20“ topmargin=“30“,(3)bgproperties=fixed bgproperties=fixed使背景图片成水印效果，即图片不随着滚动条的滚动而滚动

6、。,2. 换行标记BR标记强行规定了当前行的中断，使后续内容在下一行显示。, 设置文本格式,1. 分段标记P分段标记定义了一个段落。若同时使用和，则将段落包围起来，表示一个分段的块；若省略结束标记，可以将开始标记放在段尾。分段标记的常用属性是ALIGN，用于设置段落的水平对齐方式。,1排版：分段与换行段落是文档的基本信息单位。将文档划分为段落，可以通过使用分段标记、换行标记、标题标记或插入水平线来实现。,文字,3.预设格式标记作用：令文件按照原始码的排列方式显示。,4. 标题标记Hn标题标记用于设置文档中的标题和副标题，其中n的取值是1到6；.标记表示字体最大的标题，标记表示字体最小的标题。,

7、 标题 ,5. 区隔标记 作用：设定字、画、表格等的摆放位置。若要将文档中的多个段落设置成相同的对齐方式，可将这些段落置于和标记之间组成一个节。,6. 水平线标记HRHR标记在文档中添加一条水平线，用来分开文档的两个部分。该标记有以下属性：,(1) ALIGN：指定线的对齐方式，取值为left（左对齐）、center（居中对齐）或right（右对齐），默认值为center。 (2) COLOR：指定线的颜色。 (3) NOSHADE：若指定该项，则显示一条无阴影的实线。 (4) SIZE：指定线的粗细，以像素为单位。 (5) WIDTH：指定线的长度，单位可以是像素或百分比（占页面宽度的百分比

8、）。,2设置对齐方式,HTML语言中，可以用ALIGN属性来设置对齐方式。,ALIGN属性可以应用于多种标记，如.、.、等。ALIGN属性的取值可以是：left 左对齐 center 居中对齐 right 右对齐 justify 两边对齐,对于不同的标记，ALIGN属性的默认值是有所不同。对于分段标记、各个标题标记，其默认值为left；对于水平线标记，其默认值为center。, 受影响的文字,FACE属性指定一种字体，或者给出一个字体列表，各种字体名称用逗号来分隔，可以按照作者的喜好程度来排列。,3设置字体、字号和颜色,在HTML语言中，可以使用字体标记.来设置文本的字符格式，为此可以将文本置

9、于和标记之间，并通过FACE、SIZE和COLOR属性进行相关设置，如下,SIZE属性指定字体的大小（即字号），其取值可以从1到7，默认值为3。SIZE属性值越大，显示的字号就越大。相对于基本字体（BASEFONT）的大小，也可使用或号来指定相对字号，此外，还可以自行输入字体大小。,COLOR属性指定文本的颜色，可以用颜色名称表示，也可以用十六进制RGB格式表示。,超文本标记语言,超文本标记语言 ASP动态网页设计,超文本标记语言 ASP动态网页设计,通过设置字符样式可以为某些字符设置特殊格式，例如粗体、斜体、下划线、删除线、上标、下标等。常用的设置字符样式的标记如下：,4设置字符样式,. 加

10、粗 . 斜体 . 带下划线 . 标准打印机字体 . 带删除线 . 上标 . 下标 . 大字体文本 . 小字体文本,width和height 这两个属性定义了字符滚动区域的宽度和高度。可以用像素数和百分比来表示。 align 指定了滚动字符如何于周围对象对齐。 behavior 定义了字符如何滚动。 bgcolor 定义了滚动字符区域的背景。 direction 定义了字符滚动的方向。 hspace和vspace 定义了滚动字符四周水平和垂直方向上的间隙。 loop 指定滚动重复次数 。 scrollamount 指定文本滚动步长的像素数。 scrolldelay 指定两次滚动间的毫秒延时数。,

11、指走动或卷动的 文字，其参数设定较多。,5 MARQUEE跑马灯,其他标记, 设置图像格式,图片标记使用图片标记可以将一幅图片插入到网页中。图片标记的格式为：,返回,插入HTML 文件头标签 刷新,刷新操作,文件头标签，即标签,插入HTML文件头标签,http-equiv属性http-equiv属性可以向浏览器传回一些有用的信息，以帮助正确和精确地显示网页内容语法格式为： meta http-equiv=“参数” content=“参数变量值” “参数”有 expires，pragma，refresh，set-cookie，content-type等,显示滤镜的应用,可以利用混合(blend)

12、和显示(reveal)两种滤镜在页面上添加动人的淡入淡出、网页转换效果，前者可以使页面中的对象逐渐消失或显示，后者提供了24种网页转换的效果。,或blendtrans(duration=20) 将产生页面切换时的渐隐效果,page-enter page-exit site-enter site-exit,revealtrans(duration=5，transition=23) 将产生页面切换时的动画效果,返回,矩形从大至小0 矩形从小至大1 圆形从大至小2 圆形从大至小3 向上推开4 向下推开5 向右推开6 向左推开7 垂直形百叶窗8 水平形百叶窗9 随机溶解水平棋盘10 垂直棋盘11 随机溶解12 垂直向内裂开13 垂直向外裂开14 水平向内裂开15 水平向外裂开16 向左下剥开17 向左上剥开18 向右下剥开19 向右上剥开20 随机水平细纹21 随机垂直细纹22 随机选取一种特效23,transition 转换类型对应代号：,其主要语法格式如下： blendTrans(duration=时间数值) revealTrans(duration=时间数值，transition=过渡类型）,其参数意义如下： duration表示滤镜执行需要的时间，单位为秒； transition表示对象转换的方式，过渡类型的数值为023中的一个数值，其具体意义如下。,