《《ASP程序设计》-叶潮流-电子教案及习题答案 第2章Html语言》由会员分享，可在线阅读，更多相关《《ASP程序设计》-叶潮流-电子教案及习题答案 第2章Html语言（50页珍藏版）》请在金锄头文库上搜索。
1、ASP程序设计课件 2008 年 12 月,中国水利水电出版社,本章导读,由于ASP程序一般是内嵌在HTML标记中的，而且ASP程序在服务器解析之后，将结果也是以HTML源码形式传送给客户端，所以正确认识和理解HTML标记语言是学习和制作ASP网页的客观要求。 知识要点： HTML概述 文本格式 排版布局 列表 图片和视频 超链接和热点链接 表格 表单 框架 多媒体,2.1.1 HTML语言标记 2.1.2 HTML文档的结构,2.1 HTML概述,HTML语言标记是由英文单词或其缩略字母和一对定界符（）共同组成，如和、和等。每一个标记有一系列属性。标记约定、描述、标识了信息内容，属性控制了信
2、息内容显示效果。标记和属性共同控制网页内容及其效果，语法格式如下： 格式：信息内容 说明： 标记名、属性名和属性值不区分字母大小写； 标记名和属性名之间，属性名和属性名之间要适当空格； 属性使用的个数是没有限制的，使用多个属性时，属性之间没有先后顺序； 绝大数标记都是成对出现的，也有标记是单标记，没有结束标记。,2.1.1 HTML语言标记,HTML语言标记内容丰富，从功能上大体可分为：文本结构设置、文本格式标记、排版布局、列表、图片和视频标记、超链接和热点链接、表格、表单、框架和多媒体。虽然内容丰富，但HTML文档结构简单，通常包括html、head、body三部分，基本结构如下： 标题部分
3、 正文部分 ,2.1.2 HTML文档的结构,说明： ：文档标记，处于最外层，一般来说html文件总是以开头，又以结束，整个html文件的所有内容都包括在这对标记之中。 ：文件头标记，位列文档开始部分，一般包括， ，等文件头元素，这些元素不属于文件本体。 下面简要介绍head部分所包含标记元素的功能及用法:,2.1.2 HTML文档的结构,：定义网页标题，其中包含的文字或符号，将会显示在浏览器窗口的标题栏。 第二章HTML语言 ：定义网页相关说明信息，其中定义的信息是不显示的，包括以下几种。 l 定义搜索关键字，提供给搜索引擎使用，常见的两种用法： l 控制页面缓存，设置打开的网页是否总是最新
4、版本： l 设定网页字符编码的解码方式，如简体中文： l 设定自动刷新页面时间(聊天室常用)： ,2.1.2 HTML文档的结构,：指定当前文档和其它文档之间的联接关系。 注释：rel说明两个文档之间的关系；href说明链接目标文档名，.css说明文档是层叠样式表，有关CSS详细信息请参照有关CSS书籍。 ：定义超链接的基准地址目录。 ：用来在页面中加入脚本程序。 ：指定当前文档的css层叠样式表。css对于网页的字体样式背景边界等都有很大的应用。有关css详细内容请参阅相关书籍。,2.1.2 HTML文档的结构,：文件主体标记，是Html文档的主体部分，页面内容其它标记一般都位列其中，标记有
5、很多属性，用于定义网页总体风格，常见属性如表2-1所示： 注意： 颜色有三种表示方法，分别如下：16进制颜色代码格式：#RRGGBB；10进制RGB码格式： RGB(RRR，GGG，BBB)；直接写出颜色英文名称，如BlackWhiteGreenMaroonOliveNavyPurpleGrayYellowLimeAguaFuchsiaSilverRedBlue和Teal。 长度表示方法有两种，即绝对长度和相对长度。它们的单位分别是像素(pixel)和百分比(%)，像素代表的是屏幕上的每个点，而百分比代表的是相对于客户端浏览器的多少。 link，alink，vlink属性的用法已经不使用了，多
6、数是在文件头中加入相应的CSS代码，以达到需要的效果。,2.1.2 HTML文档的结构,2.2 文本格式标记,2.2.1 标题标记(Header) 2.2.2 字体标记 2.2.3 字形变化标记 2.2.4 特殊字符,2.2.1 标题标记(Header),格式： 说明：标题字体的大小一共有六级（#=1，2，3，4，5，6），从到依次减小，标记中h后面的数字越大标题文本就越小。使用标题标记时，字体变成粗体字，并且会自成一行。align属性用来设置标题的对齐方式，其中left表示左对齐，center表示居中对齐，right表示右对齐。,2.2.2 字体标记,格式： 或者： 说明：face指定网页的
7、字体名称；color指定文字颜色；size指定文字大小。也可以写成：文字内容，表示比预设字大（小）一级。 改变文字大小的预设值，直接加在标记之后就行了。一般而言，若是没有特别预设，文字大小预设值默认为3。,2.2.3 字形变化标记,文字的字形也有相当多的变化，如粗体、斜体等，HTML定义了许多特殊的字形或字体来强调、突出、区别以达到提示的效果。,2.2.4 特殊字符,很多特殊的符号无法直接显示在网页上，比如说“需要特别处理才能显示。常用的特殊符号如表2-3所示：,2.3 排版布局,2.3.1 段落标记 2.3.2 段中分行和禁止分行标记 2.3.3 段落向右缩进标记 2.3.4 块置中标记 2
8、.3.5 分区显示标记 2.3.6 水平分隔线标记 2.3.7 注释标记 2.3.8 预定格式标记,2.3.1 段落标记,格式： 或者： 说明： ：强制段中换行，clear属性用来控制文字和图片的位置，取值及含义如下： l none：文字换行后，直接排列在之前的下一行； l left：换行文字移至图片下方，靠左对齐； l right：换行文字移至图片下方，靠右对齐； l all：换行文字移至图片下方对齐； ：不换行。,2.3.2 段中分行和禁止分行标记,格式： 说明：加入的文字，全部往右缩进一单位。而且每加一组标记，往右缩进一单位，如加两组标记，往右缩进两单位，依此类推。,2.3.4 块置中标
9、记,格式： 说明：最常用到的标记之一，将文字图片表格等任何可以显现在网页上的对象置中对齐。,2.3.6 水平分隔线标记,格式： 说明：插入水平线，常见属性说明如表2-4所示：,2.3.7 注释标记,格式： 说明：注释内容不会在浏览器中显示出来，仅用于对网页有关内容说明。,2.3.8 预定格式标记,格式： 说明：将其中包含的文字排版和字体格式，原样展现在网页上。,2.4 列表标记,2.4.1 无序列表 2.4.2 有序列表 2.4.3 自定义列表,2.4.1 无序列表,格式： 说明：无序列表是指没有进行项目编号的列表。type属性用来指定列表的项目符号，可取值circle（空心园），square
10、（小方块），disc（实心园，默认值）。注意书写时必须小写。,2.4.2 有序列表,格式： 说明：有序列表是指带有先后顺序编号的列表，如果插入和删除一个项目，编号会自动进行调整。type属性用来指定列表的项目编号类型，其中1表示列表的项目编号用数字标号(1，2，3)表示；A表示列表的项目编号用大写字母标号(A，B，C)表示；a表示列表的项目编号用小写字母标号(a，b，c)表示；I表示列表的项目编号用大写罗马数字标号(，) 表示；i表示列表的项目编号用小写罗马数字标号(i，ii，iii) 表示。,2.4.3 自定义列表,格式： 第1项 注释1 第2项 注释2 第3项 注释3 说明：自定义列表的标
11、记也叫描述性项目列表，这种方式很少用。定义列表默认为两个层次，第一层为列表项标记，第二层为注释项标记，注释项默认显示在另一行中。和标记通常是成对使用的，一个列表项标记也可以对应几个注释项标记。,2.5 图片和视频标记,2.5.1 图片标记 2.5.2 视频标记,2.5.1 图片标记,格式： 说明：插入一个行内图像，常见属性如下： src=“ “：指定图像的文件名和路径； alt=“ “：指定鼠标指向图像时的提示文字； align=“ “：指定图像和文字之间的排列属性，可选值及含义如表2-5所示,2.5.1 图片标记,border=“ “：指定图像边框宽度； hspace=“ “：指定图像离左右
12、文字的水平距离； vspace=“ “：指定图像离上下文字的垂直距离； height=“ “：指定图像高度大小； width=“ “：指定图像宽度大小； lowsrc=“ “：指定显示设定低分辨率图片。,2.5.2 视频标记,格式： 说明：插入一个视频文件，常见属性如下： dynsrc=“avi文件地址“：指定视频的文件名和路径； loop=“ “：指定avi文件循环播放次数，取值-1时始终播放； loopdelay=“ “：指定avi文件循环播放延迟时间； start=“ “：指定avi文件播放方式，可取值fileopen或mouseover。,2.6 超链接和热点链接,超链接可以说是网页中
13、最具活跃的标记，通过它可以轻易地在不同网站之间，不同网页之间跳来跳去，构画出丰富多采的WWW世界。超级链接除了可链接文本外，也可链接各种媒体，如声音、图像、动画等。 按照目标页面的特征，可以将超链接分为以下两种形式： (1)文件链接：这种链接的目标页面是一个文件，它可以是当前站点的网页，也可以是其它站点的页面，或者E-mail链接等。 (2)锚点链接：这种链接的目标是网页中的一个位置，通过这种链接可以从当前网页当前位置跳转到当前页面或其它页面中的另一个位置。,2.6.1 文件链接,格式：超链接文本 (1)href：必选属性，指定目标页面的URL地址，URL地址由协议、域名路径、文件名构成； 说
14、明： (2)target：可选属性，指定目标文档的窗口打开模式，可取值既可以是窗口或框架的名称，也可以选值为_blank，_parent，_self，_top；有关target取值及其含义请参阅2.9节； (3)title：可选属性，用于指定鼠标指向超链接时所显示的提示文字。 文件链接的链接方法根据具体应用不同而有所不同，主要有如下几种： l 网页文件链接 合肥学院 l 电子邮件链接 写信给我 ftp链接 FTP服务,2.6.2 锚点链接,格式： 文本 提示文本 说明： 创建一个指定名称的书签(记号)，名称由name属性指定； 建立锚点链接关系，href属性值由“#”号引导且必须与name属性
15、值一致； 可以在不同页面中建立锚点链接，例如在test.htm页面中建立一个top记号，在其它页面跳转到该锚点，代码如下： 跳转到test.htm页的top位置,2.6.3 热点链接,图像的链接和文字的链接方法是一样的，都是用标记来完成，只要将标记放在和之间就可以了。 在HTML中还可以把一幅图片划分成不同的热点区域，分别链接到不同网页资源，这就是热点链接，又称为影像地图。 热点链接基本结构如下： ,说明： 在标记中一定要设置usemap参数值来自定义“图像地图名称”，且必须与标记中的name参数值相同； 在标记中定义热点区域，同一“图像地图”中的所有热点区域都要在图像地图的范围内，即所有标记
16、均要在与之间； shape属性定义热点区域形状，取值可以是矩形rect，圆形circle，多边形poly； coords属性定义热点区域的坐标列表，coords 属性设定的坐标格式要与shape属性设定的作用区域形状匹配； shape属性和coords属性相匹配语法格式示例如下： a）矩形：必须使用四个数字，前两个数字为左上角座标，后两个数字为右下角座标。 例： b）圆形：必须使用三个数字，前两个数字为圆心的座标，最后一个数字为半径长度。 例： c）任意图形(多边形)：将图形之每一转折点坐标依序填入。 例：,2.7 表格,表格在网页应用中非常广泛，表格不但可以固定文本或图像的输出位置，而且也可以辅助设置背景和前景的颜色。大型网站一般借助于表格来布局和排版，把相互关联的信息元素集中定位和管理。 2
