第4章 用HTML建立超链接.ppt

1、第四章 用HTML建立超链接,4.1 设置基本文字超链接,建立HTML标记为标记。超链接最重要的两个要素，设置为超链接到文本内容和超链接指向的目标地址。 基本超链接的结构如下： 百度,链接标记,属性,地址,链接文本,URL的格式,每个文档在互联网上有唯一的地址，该地址被称为统一资源定位器（Uniform Resource Laocator）,简称URL。 URL由四个部分组成：协议、主机名、文件夹名和文件名。 ,协议,主机名,文件夹名,文件名,URL的类型,超链接的URL有两种类型：绝对URL和相对URL。 绝对URL如下： 相对URL分为两种： 1、相对文档的URL，这种URL以链接的原文档

2、为起点。 2、相对服务器的URL，这种URL以服务器的根目录为前点。,URL的类型, 超链接 点击链接01链接到第1个网页。 点击链接02链接到第2个网页。 点击链接03链接到第3个网页。 ,绝对URL,服务器相对URL,文档相对URL,绝对URL和文档相对URL比较常用。,4.2 设置页面内部特定目标的链接,超链接不仅可以跳转到其他页面，也可以在本业内跳转。,二者的跳转目标名称必须要一致,4.2 设置页面内部特定目标的链接, 无标题文档 第1本书 第2本书 第3本书 精通CSS+DIV网页样式与布局 本书系统地讲解了CSS层叠样式表的能力。 详细介绍 CSS设计彻底研究 本书是一本深入研究和

3、揭示CSS设计技术的书籍。本书在以然。 详细介绍 CSS设计禅意花园 本书作者是世界著名的网站设计师，性能优良且具有强大生命力的网站。 ,4.3设置图片的超链接, 图片的超链接 ,4.3设置图片的超链接,为图片添加一个超链接后，浏览器就会自动给图片加上一个粗边框，就像在建立文字超链接时会加上下划线一样。如果希望去掉这个边框，只需要在标记中设置border=“1”后就可以取消这个边框。 ,4.4 设置电子邮件链接,电子邮件链接类似于URL的链接方式，格式是mailto:电子邮件地址。 邮件的链接 联系我们：给我们发送邮件。 ,4.5 设置以新窗口显示链接页面,如果要在点击某个链接以后，打开一个新

4、的浏览器窗口，在这个新窗口里显示目标页面，就需要在标记中设置”target” 属性。 Target属性设置为“_blank”，就会自动打开一个新窗口，显示目标页面。,4.5 设置以新窗口显示链接页面, 以新窗口方式打开 以新窗口方式打开一个页面。 ,4.6 创建热点区域,所谓图片的热点区域就是将一个图片划分成若干个链接区域。访问者点击不同区域会链接到不同的目标页面。 HTML中可以使用3种类型的热点区域：矩形、圆形和多边形。,4.6 创建热点区域, ,矩形,左,上,右,下,链接地址,4.6 创建热点区域, ,左,上,半径,各点坐标,4.6 创建热点区域,在设计窗口中定位热点区域：,4.6 创建

5、热点区域,1、创建新文档，插入图片。 2、在属性面板中选择要创建的热点类型（矩形、圆形、多边形） 3、画区域 4、指针热点进行调整 5、输入跳转的目标页面 6、选择跳转方式,4.7 框架之间的链接,框架是一种常用网页布局工具。它的作用是把浏览器的显示空间划分为几个部分，每个部分都可以独立显示不同的页面。,建立框架与框架集（ ）,和 标记是与和同级的，因此，不要将和标记包含在标记中，否则标记将无法正常使用。,用cols属性将窗口分为左右两部分,窗口框架的分割方式有两种，一种是水平分割，另一种是垂直分割。在标记中的cols属性和rows属性用来控制窗口的分割方式。 Cols属性可以将一个框架集分割

6、为若干列，其中语法结构是： N1表示窗口1的的宽度，以像素或百分比为单位 *表示分配给前面所有窗口后剩下的宽度。 比如,那么星号就代表50%,用rows属性将窗口分为上中下三部分, ,框架的嵌套,Rows属性和cols属性也可以混合起来使用，实现框架的嵌套。 ,用src属性在框架中插入网页,其语法结构如下： ,用src属性在框架之间链接（P63）,Target的四种属性： _blank:表示新打开一个浏览器窗口，在其中显示链接的目标页面。 _self:相当于不设置target属性，窗口中显示链接的目标页面。 _top:表示在顶级框架，也就是在浏览器窗口中显示链接的目标页面。 _partent：

7、表示在上一级框架中显示链接的目标页面。,创建嵌入式框架, 也称为“浮动框架”，可以自由控制窗口的大小。 在使用的时候不需要创建框架集，直接插入即可。 ,4.8 链接增多后网站的组织结构与维护,通常在开发网站的时候，并不是把所有的网页文件都保存在一个站点根目录下，而是使用不同的文件夹存放不同性质的文件。 建立起合适的网站文件存储结果，能迅速定位自己需要的文件，或者将制作完成的文件存储到相应的目录中，进行网站的开发工作。,4.8 链接增多后网站的组织结构与维护,方案一 将不同类型的文件存放在不同的文件夹中，这种存储方法使用于中小型的网站，该方法是用过文件的类型对文件进行管理。 例如：将图片文件都放在Pic文件夹中，将声音文件都放在sounds文件夹中。,方案二,按照主题对文件进行分类管理。在这种存储方案中，网站的页面按照不同的主题进行分类存储。关于某个主题的所有文件被存放在一个文件夹中，然后再进一步细分文件的类型。这种存储方案使用那些