HTML 图像的插入:
HTML 图像的标签是 <img> ,<img>是空标签,并且没有闭合标签。要在页面上显示图像,你需要使用源属性(src)。
定义图像的语法是:
<img src="url" alt="some_text"> /*URL 指存储图像的位置*/
如果名为 "pulpit.jpg" 的图像位于 www.runoob.com 的 images 目录中,那么其 URL 为
http://www.runoob.com/images/pulpit.jpg
实例 --->
<html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p>一个来自文件夹中的图像:</p> <img src="/images/chrome.gif" alt="Google Chrome" width="33" height="32"><p>一个来自菜鸟教程的图像:</p> <img src="http://www.runoob.com/images/logo.png" alt="runoob.com" width="336" height="69"> </body> </html>
" alt " 属性用来为图像定义一串预备的可替换的文本
在浏览器无法载入图像时,替换文本属性告诉读者她们失去的信息。此时,浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯,这样有助于更好的显示信息,并且对于那些使用纯文本浏览器的人来说是非常有用的。
height(高度) 与 width(宽度)属性用于设置图像的高度与宽度
属性值默认单位为像素 --->
<img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228">
提示: 指定图像的高度和宽度的一个很好的习惯。如果图像指定了高度宽度,页面加载时就会保留指定的尺寸。如果没有指定图片的大小,加载页面时有可能会破坏HTML页面的整体布局。
HTML 图像标签:
<img> 定义图像
<map> 定义图像地图
<area> 定义图像地图中的可点击区域
实例 --->
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap"> <map name="planetmap"> <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun"> <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury"> <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus"> </map>