《网页设计》课件-2-3图像与超级链接标签

图像与超级链接标签目录◎图像标签<img>◎超级链接标签<a>1图像标签<img/>HTML语言也专门提供了<img>标签来处理图像的输出。

语法：<imgsrc="图像URL"/>src属性用于指定图像文件的路径和文件名，它是img标签的必需属性。<img>标签的属性属性描述src图像的URL的路径title鼠标悬停时显示的内容alt提示文字width图像的宽度，通常只设为图片的真实大小以免失真height图像的高度，通常只设为图片的真实大小以免失真align图像和文字之间的对齐方式值可以是top、middle、bottom、left、rightborder边框宽度hspace水平间距，设置图像左侧和右侧的空白vspace垂直间距，设置图像顶部和底部的空白1图像标签<img/>举例演示【实例2-3】图像标签的使用。2超级链接标签<a>超文本链接（HyperTextLink）通常简称为超链接（HyperLink），或者简称为链接（Link）。链接是HTML的一个最强大和最有价值的功能。链接是指文档中的文字或图像与另一个文档、文档的一部分或者一幅图像链接在一起。1.创建超级链接超链接超级链接主要通过<a></a>标签环绕链接对象创建。

语法：<ahref="资源地址"target="窗口名称"title="链接提示文字">链接对象</a>target属性用于指定打开链接的目标窗口，其取值有_self和_blank两种，其中_self为默认值，意为在原窗口中打开，_blank为在新窗口中打开。标签<a>表示超链接的开始，</a>表示超链接的结束。href属性定义了这个链接所指的目标地址。2超级链接标签<a>举例演示【实例2-4】超级链接的创建。2.绝对路径和相对路径（1）绝对路径绝对路径就是主页上的文件或目录在硬盘上的真正路径。（2）相对路径相对路径是以当前文件所在路径为起点，进行相对文件的查找。如果链接到同一目录下，则只需要输入要链接文件的名称。要链接到下级目录中的文件，只需先输入目录名，然后加“/”符号，再输入文件名。要链接到上一级目录中的文件，则先输入“../”，再输入文件名。相对路径举例说明相对路径名含义href="index.html"index.html是本地当前路径下的文件href="web/index.html"index.html是本地当前路径下称为“web”子目录下的文件href="../index.html"index.html是本地当前目录的上一级子目录下的文件href="../../index.html"index.html是本地当前目录的上两级子目录下的文件2.绝对路径和相对路径锚点的定义语法：<aname="锚点名称">文字</a>

或者<aid="锚点名称">文字</a>在该语法中，书签名称就是对后面跳转所创建的书签，文字则是设置链接后跳转的位置。（3）锚点链接锚点是可以与链接的文字在同一个页面，也可以在不同的页面的超链接。创建锚点链接分为两步，先定义锚点，再通过id名标注跳转到锚点目标的位置。锚点链接的语法：<ahref=“#书签的名称"＞链接的文字</a>在该语法中，书签的名称就是刚才定义的书签名，也就是name的赋值。而#则代表这个书签的链接地址。举例演示【实例2-5】锚点链接的创建。创建锚点链接通过锚点定位到相应位置在该语法中要先定义影像地图的名称，然后在引用这个影像地图。在<area>标签中定义了热区的位置和链接目标，其中shape用来定义热区形状，可以取值rect（矩形）、circle(圆形区域)、poly（多边形区域）；coords参数则用来设置区域坐标，对于不同的形状来说，coords设置的方式也不同。2.绝对路径和相对路径（4）影像地图将图像划分成不同的区域进行超链接设置被称为影像地图。包含热区的图像也可以称为影像地图。在图像文件中映射图像名，在图像的属性中使用usemap属性添加图像要引用的映射图像的名称如下：<imgsrc="图像地址"usemap=“#影像地图名称">然后需要定义影像地图以及热区的链接属性如下：<mapname="影像地图名称"> <areashape="热区形状"coords="热区坐标"href="链接地址"></map>在该语法中要先定义影像地图的名称，然后在引用这个影像地图。在<area>标签中定义了热区的位置和链接目标，其中shape用来定义热区形状，可以取值rect（矩形）、circle(圆形区域)