Html图像
1、插入图像
<p>
一幅图像：<img src="xxx.jpg" width="256" height="256" />
</p>
<p>
一幅动态图像：<img src="xxx.gif" width="256" height="256" />
</p>
插入图像和动态图像的语法相同
2、从不同位置插入图片
从另外的文件夹插入图像
<p>
一幅图像：<img src="./xxx.jpg" width="256" height="256" />---./代表图片同文件夹下，../代表图片在上一级文件夹下。注意：调整width和height的值可以调整图像的大小
</p>
从网络链接图像
<p>
一幅动态图像：<img src="网络图片地址" width="256" height="256" />（注：这里的地址为图片地址，而不是图片链接的地址）
</p>
3、背景图片
<body background="/i/eg_background.jpg">
<p>gif和jpg文件均可用作html背景</p>
<p>如果图像小于页面，图像会进行重复</p>
</body>
4、图像的排列
<p>图像底部<img src="/i/eg_pic.jpg" align="bottom">与文本对齐</p>——bottom对齐方式是默认的对齐方式
<p>图像中部<img src="/i/eg_pic.jpg" align="middle">与文本对齐</p>
<p>图像顶部<img src="/i/eg_pic.jpg" align="top">与文本对齐</p>——疑问，操作中，顶部对齐的表现总是不尽如人意！
<p><img src="/i/eg_pic.jpg" align="left">图像浮动在文本的左侧</p>
<p><img src="/i/eg_pic.jpg" align="right">图像浮动在文本的右侧</p>
5、为图像显示替换文本
<p>当图像正常显示时，替换文本“alt”不会显示</p>
<p>当图像不能正常显示时，浏览器会显示替换文本“alt”</p>
<img src="./chj.jpg" alt="长江">
实践发现，Chrome浏览器对“alt”和“bgsound”元素均不能正常支持，IE浏览器可以
6、创建图像映射
下面是段图像映射代码：
<html>
<body>
<p>点击图像上的星球，查看独立图像</p>
<img src="/i/eg_planets.jpg" boder="0" usemap="#planetmap" alt="Planets" />
<map name="planetmap" id="planetmap"> <!---usemap属性引用了map元素中的id和name属性>
<area shape="circle" coords="180,139,14" <!---coords表示圆心坐标x，y和半径r>
href="/example/html/venus.html" target="_blank" alt="Venus" />
<area shape="circle" coords="129,161,10"
href="/example/html/mercur.html" target="_blank" alt="Mercury" />
<area shape="rect" coords="0,0,110,260" <!---rect代表矩形，coords中前两个元素表示矩形一个点的坐标，后两个元素表示对角点的坐标>
href="/example/html/sun.html" target="_blank" alt="Sun" />
</map>
</body>
</html>
7、把图像设置为图像映射
<!DOCTYPE html>
<html>
<body>
<p>把鼠标放在图像上看状态栏的坐标如何变化</p> <!--Chrome不支持坐标显示，IE支持>
<a href="http://img.web07.cn/uploads/Mobile/c100719/12O513X3050-325c.jpg">
<img src="./chj.jpg" ismap /></a>
</body>
</html>
109
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
