第四章使用图像
目录
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>