(第四章)使用图像

第四章使用图像

目录

第四章使用图像

1、图像的格式

2、插入图像

2.1插入图像标记img

2.2图像的源文件src

2.3图像的提示文字alt

2.4图像的宽度和高度

3、图像的超链接

3.1图像的超链接

3.2图像热区链接


1、图像的格式

网页中图像的格式通常有3种,即GIF、JPEG和PNG。目前GIF和JPEG文件格式的支持情况最好,大多数浏览器都可以查看它们。由于PNG文件具有较大的灵活性并且文件较小,所以它对于几乎任何类型的网页图形都是最合适的,但是早期的浏览器只能部分支持PNG图像的显示。建议使用GIF或JPEG格式,以满足更多人的需求。

2、插入图像

在页面中插入图像可以起到美化作用,插入图像的标记只有一个,那就是img标记。

2.1插入图像标记img

2.2图像的源文件src

src属性用于指定图像源文件所在的路径,它是图像必不可少的属性。

语法:<img src="图像文件地址">

2.3图像的提示文字alt

提示文字有两个作用,当浏览网页时,如果图像下载完成,将鼠标指针放在该图像上,鼠标指针旁边会出现提示文字。第二个作用是,如果图像没有被下载,在图像的位置上就会显示提示文字。

语法:<img src="图像文件的地址" alt="提示文字的内容">

2.4图像的宽度和高度

语法:<img src="图像的文件地址 width="图像的宽度" height="图像的高度">

在该语法中,图像的宽度和高度的单位是像素。

3、图像的超链接

处理文字可以添加超链接外,图像也可以设置链接属性。同一个图像的不同部分也可以链接到不同的文档,这就是热区链接。

3.1图像的超链接

图像的链接和文字的链接方法是一样的,都是用<a>标签来完成,只要将<img>标签放在<a>和</a>之间就可以了。

语法:<a hred="链接地址"><img src = "图像的文件地址"></a>

3.2图像热区链接

在HTML中可以把图片划分成多个热点区域,每一个热点区域链接到不同的网页。这种效果实质是把一幅图片划分成不同的热点区域,再让不同的区域进行超链接,这就是映射地图。

语法:

首先需要在图像文件中设置映射图像名,在图像的属性中使用<usemap>标记添加图像要引用的映射图像的名称如下:

<img src="图像地址" usemap="映射图像名称">

然后需要定义热区图像以及热区的链接属性如下:

<map name="映射图像名称">

<area shapr="热区形状" coords="热区坐标" href="链接地址">

</map>

发布了17 篇原创文章 · 获赞 0 · 访问量 217

猜你喜欢

转载自blog.csdn.net/SUN19980421/article/details/104391373