前言img元素在网页中嵌入图片今天特地测试了img的几个属性,在此做个记录。1、img元素的宽高属性。(1)当不设置width,height时,浏览器显示的图片与原图大小相等。(2)当只设置了width或者height时,图片会按比例缩放,确定没有设置的width或者height的值。(3)同时设置宽高时,图片会被缩放到正好等于设置的宽高,图片中的内容会完整显示,图片可能会变形(当是未按比例缩放)。2、img元素的title属性和alt属性(1)图片正常显示时,鼠标停留在图片上可以看到title的内容。(2)当图片不显示时,alt的内容会显示在应该显示图片的地方,鼠标停留在图片上可以看到title的内容。3、img元素的ismap属性(1)设置ismap属性后,当用户点击ismap图片时,浏览器会自动发送鼠标的x、y位置(相对于左上角)图片)到服务器。(2)仅当元素是具有有效href属性的元素的后代时,才允许使用ismap属性。(3)ismap属性将图像定义为[服务器端图像映射]。【图片图】是指带有可点击区域的图片。我的理解【服务器端映射】:获取坐标,交给服务器处理。
中的图片后,会跳转到一张图片,同时地址栏中会显示鼠标点击的坐标的浏览器。如下图所示:4.img元素的usemap属性(1)使用usemap将鼠标点击图片时的坐标转换成具体的行为,包括加载和显示另一个文档。(2)利用img元素的usemap属性,在点击图片特定区域时跳转到特定地址。(3)usemap属性将图像定义为[客户端图像映射]。我对【客户端映射】的理解:获取坐标,在本地使用。例如:点击下图中的浏览器图片区域可以使用usemap跳转到相关界面。
