HTML网页设计教程第5章超级链接

合集下载

相关主题

html网页设计基础

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

5.1超链接简介
5.1超链接简介
5.2创建超链接
建立超链接的标记是a(anchor，锚)，以<a>开始，以 </a>结束，锚可以指向网络上的任何资源：一张HTML页面，一幅图像，一个声音或视频文件等。基本语法： <a href="url" title="指向链接显示的文字" target=" 窗口名称">超链接名称</a> "> </a>
5.2创建超链接
<!—程序程序5-1--> 程序 <html> <head> <title>创建链接创建链接</title> 创建链接 </head> <body> <center> <h2>创建链接创建链接</h2> 创建链接 <hr> <p><a href="http://www.sina.com.cn" title="打开新浪首页新浪</a>  打开新浪首页新浪添加新浪链接 <br> <a href="http://www.baidu.com" target=_blank>百度百度</a>  百度添加百度链接 <br> <a href="http://www.pku.edu.cn">北京大学</a>  北添加北京大学链接 </p> </center> </body> </html>
5.2创建超链接
5.2.1设置超链接路径
建立链接时，属性“href”定义了这个链接所指的目标地址，也就是路径。理解一个文件到要链接的那个文件之间的路径关系是创建链接的根本。每一个网站都具有独一无二的地址，英文中被称作URL（Uniform Resource Locator），即统一资源定位器，同一个网站下的每一个网页都有不同的地址，但是在创建一个网站的网页时，不需要为每一个链接都输入完整的地址，我们只需要确定当前文档同站点根目录之间的相对路径关系就可以了。
5.2.2内部链接
5.2.3外部链接
所谓外部链接，指的是跳转到当前网站外部，与其它网站中页面或其它元素之间的链接关系。这种链接的URL地址一般要用绝对路径，要有完整的URL地址。
Байду номын сангаас
5.3.1图片链接
可以为一个图片指定链接。可以为一个图片指定链接。基本语法：基本语法： <a href="url" target="目标窗口的打开方式目标窗口的打开方式 "><img src="图片地址图片地址"></a> 图片地址
5.3.2书签链接
基本语法：基本语法：
在同一页面内要使用书签链接的格式： <a href="#书签名称" target="窗口名称">链接标题 </a> 在不同页面之间要使用书签链接的格式（在不同页面中链接的前提是需要指定好链接的页面地址和链接的书签名称）： <a href="URL地址#书签名称" target="窗口名称">链接标题</a> 以上两种书签链接形式，链接到的目标为： <a name="书签名称">链接内容</a>。
5.3.3电子邮件链接
 程序 <html> <head> <title>发送邮件发送邮件</title> 发送邮件 </head> <body> <p> 这是邮件链接：这是邮件链接： <a href="mailto:xyz@gmail.com?cc=abc@yahoo.com.cn&subject =你好你好 &bcc=a@gmail.com&body=祝你度过快乐的一天！"> 祝你度过快乐的一天！祝你度过快乐的一天联系我们</a> 联系我们 </p> </body> </html>
5.3.5下载文件的链接
5.4图像映射
图像映射就是在图像上先划分出不同的区域，图像映射就是在图像上先划分出不同的区域，然后定义哪个目标与图像的哪个区域对应，义哪个目标与图像的哪个区域对应，但单击图像的某一区域，就会把用户带到一个目标，单击另一区域，又会把用就会把用户带到一个目标，单击另一区域，户带到另外的目标。其实，户带到另外的目标。其实，图像映射就是将图像内的区域与一系列URL链接起来了，从而单击特定区域就会把用户链接起来了，与一系列链接起来了带到相应的内容。这里所讲的映射是客户端图像映射，带到相应的内容。这里所讲的映射是客户端图像映射，这和服务器端图像映射相比，运行速度要快。和服务器端图像映射相比，运行速度要快。
5.3.1图片链接
5.3.2书签链接
在浏览页面时，如果页面篇幅很长，要不断的拖动滚动条，给浏览带来不便，要是浏览者既可以从头阅读到尾，又可以很快寻找到自己感兴趣的特定内容进行部分阅读，这个时候就可以通过书签链接来实现。当浏览者单击页面上的某一“标签”，就能自动跳到网页相应的位置进行阅读，给浏览者带来方便。
5.2.2内部链接
所谓内部链接，指的是在同一个网站内部，不同的所谓内部链接，指的是在同一个网站内部，不同的html页页面之间的链接关系，在建立网站内部链接的时候，面之间的链接关系，在建立网站内部链接的时候，要明确哪个是主链接文件（即当前页），哪个是被链接文件。），哪个是被链接文件哪个是主链接文件（即当前页），哪个是被链接文件。内部链接一般采用相对路径链接比较好。部链接一般采用相对路径链接比较好。
5.3.4 FTP链接
 程序 <html> <head> <title>ftp链接链接</title> 链接 </head> <body> <p> 这是一个FTP链接：链接：这是一个链接 <a href= "ftp://ftp.pku.edu.cn/" >北京大学北京大学FTP服务器 </a> 北京大学服务器 </p> </body> </html> </html>
5.3.3电子邮件链接
5.3.4 FTP链接
FTP是一种文件传输协议，它是计算机与计算机之间能够是一种文件传输协议，是一种文件传输协议相互通信的语言，通过FTP可以获得相互通信的语言，通过可以获得Internet上丰富的上丰富的可以获得资源。资源。
基本语法：基本语法：
<a href="ftp:/…/">链接内容链接内容</a> 链接内容
5.4图像映射
<h2 align="left"><a name="zhengzhou">郑州郑州</a></h2> 郑州 <p align=“left”>郑州，河南省省会，是中国重要的内陆开放城市和历史文化郑州，郑州河南省省会，名城。郑州历史悠久，文化灿烂，旅游资源丰富。名城。郑州历史悠久，文化灿烂，旅游资源丰富。</p> <h2 align="left"><a name="beijing">北京北京</a></h2> 北京 <p align=“left”>北京中华人民共和国首都。中央直辖市，简称京，是我国第北京中华人民共和国首都。北京中华人民共和国首都中央直辖市，简称京，二大超级现代化大都市。北京是我国的政治中心、交通中心、文化中心、二大超级现代化大都市。北京是我国的政治中心、交通中心、文化中心、科研中心、教育中心。具有较高的国际知名度。研中心、教育中心。具有较高的国际知名度。</p> <h2 align="left"><a name="shanghai">上海上海</a></h2> 上海 <p align=“left”>上海是中国第一大城市，世界第八大城市，中国中央四个上海是中国第一大城市，上海是中国第一大城市世界第八大城市，直辖市之一。有超过2000万人口居住和生活在上海及其附近地区。</p> 万人口居住和生活在上海及其附近地区。直辖市之一。有超过万人口居住和生活在上海及其附近地区 <h2 align="left"><a name="changchun">长春长春</a></h2> 长春 <p align=“left”> 长春，吉林省省会，全省政治、经济、文化和交通中心，长春，吉林省省会，全省政治、经济、文化和交通中心，中国最大的汽车工业城市，中国建成区面积和建成区人口第九大城市，中国最大的汽车工业城市，中国建成区面积和建成区人口第九大城市，东北地区中部最大的中心城市。东北地区中部最大的中心城市。</p> </body> </html>
5.4图像映射
基本语法：基本语法：
<img src="URL" usemap="id/name"> <map name="name" id="id"> <area shape=" " coords=" " href="URL"> </map>
5.4图像映射
 程序 <html> <body> <p align="center"> <img src="images/chmap.jpg" width="650" height="538" border="0" usemap="#chinaMap"/> <map name="chinaMap"> <area shape="rect" coords="431,288,487,324 " href="#zhengzhou" alt="郑州郑州"> 郑州 <area shape="circle" coords="497,196,14" href="#beijing" alt="北京北京"> 北京 <area shape="circle" coords="560,327,16" href="#shanghai" alt="上海上海"> 上海 <area shape="poly" coords="542,110,629,130,587,169" href= "#changchun" alt="长春长春"> 长春 </map> </p> <br> <br>
5.3.2书签链接
5.3.2书签链接
5.3.2书签链接
5.3.3电子邮件链接
页面中建立E-mail链接，用户单击链接，系统链接，在HTML页面中建立页面中建立链接用户单击链接，会自动启动默认的电子邮件软件，打开一个邮件窗口。会自动启动默认的电子邮件软件，打开一个邮件窗口。基本语法：基本语法： <a href="mailto:E-mail地址地址[?subject=邮件主题地址邮件主题 [&参数参数值参数=参数值链接内容</a> 参数参数值]]">链接内容链接内容
基本语法：基本语法：
<a href="url">链接内容链接内容</a> 链接内容
5.3.5下载文件的链接
 程序 <html> <head> <title>下载文件下载文件</title> 下载文件 </head> <body> <p> 这是一本电子书：这是一本电子书： <a href="ds.rar">数据结构数据结构--C#</a> 数据结构 </p> </body> </html>
WEB编程基础
清华大学出版社
Company name
第5章超级链接
主要内容
• 为网页添加超链接 • 添加书签链接、电子邮件超链接、 FTP链接添加书签链接、电子邮件超链接、链接 • 建立图像映射
5.1超链接简介
网页文件的最大魅力是超越各个文件的空间，通过超链接相互连接构成一个纷繁复杂的互联网世界。超链接（hyperlink）是一个网站的精髓，超链接在本质上属于一个网页的一部分，它是一种允许一个网页同其他网页或站点之间进行链接的元素。各个网页链接在一起后，才能真正构成一个网站。超文本具有的链接能力，层层链接相关文件，这种具有超级链能力的特性，即称为超链接。超链接除了可链接文本外，也可链接各种媒体，如声音、图像和动画等，通过它们可以将网站建设成一个丰富多彩的多媒体世界。
5.3.4 FTP链接
5.3.5下载文件的链接
如果希望制作下载文件的链接，只需在链接地址处输入文如果希望制作下载文件的链接，件所在的位置即可。当浏览器用户单击链接后，件所在的位置即可。当浏览器用户单击链接后，浏览器会自动判断文件的类型，以做出不同情况的处理。自动判断文件的类型，以做出不同情况的处理。
5.3.1图片链接
 程序 <html> <head> <title>建立图片链接建立图片链接</title> 建立图片链接 </head> <body> <center> <h2>图片链接图片链接</h2> 图片链接 <hr> <a href="www.baidu.com" target="_blank"><img src= "images/baidu_logo.gif" /></a> </center> </body> </html>

HTML网页设计教程 第5章 超级链接

HTML网页设计教程第5章超级链接