<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><!--HTML图像在线实例插入图像本实例演示如何在网页中显示图像从不同的位置插入图片本实例演示如何将其他文件夹或者服务器的图片显示到网页中HTML图像-图像标签(<img>)和源属性(Src)在HTML中,图像由<img>标签定义<img>是空标签, 意思是说,它只包含属性,并没有闭合标签要是在页面上显示图像,你需要使用源属性(src).src是指source.源属性的值是图像的URL地址定义图像的语法是:<img src="URL" alt="some_text">URL是指存储图像的位置,如果名为"pupit.jpg"的图像位于www.runoob.com的images目录中.那么其URL为http://www.runoob.com/images/pulit.jpg浏览器将图像显示在文档图像标签出现的地方.如果你将图像标签置于两个段落之间,那么浏览器会首先显示第一个段落,然后显示图片,最后显示第二段.HTML图像-设置图像的高度与宽度height与width属性用于设置图像的高度和宽度属性值默认单位是像素<img src="pulpit.jpg" alt="Pupit rock" width="304" height="223">提示:指定图像的高度和宽度是一个很好的习惯,如果图像指定了高度宽度.页面加载时就会保留指定的尺寸,如果没有指定图片的大小,加载页面时有可能会破坏HTML页面的整体布局基本注意事项-有用的提示注意:假如某个HTML文件包含十个图像,那么为了正确显示这个页面,需要加载11个文件.加载图片是需要时间的,所以我们的建议是慎用图片注意:加载页面时,要注意插入页面图像的路径,如果不能正确设置图像的位置,浏览器就会无法加载图片,图像标签就会显示一个破碎的照片更多实例HTML标签<img>定义图像<map>定义图像地图<area>定义图像地图中的可点击区域--><body><p>一个图像<img src="img/smiley.gif" alt="Smiley face" width="32" height="32"/></p><p>一个动图<img src="img/hackanm.gif" alt="Computer man" width="48" height="48"/></p><p>注意插入动图的语法和静态图的语法是一样的</p><p>一个来自文件夹中的图像</p><img src="img/chrome.gif" alt="Google Chrome" width="33" height="32"/><p>一个来自菜鸟教程的图像</p><img src="//www.runoob.com/images/logo.png" alt="runoob.com" width="336" height="69"/><h4>默认对齐的图像(align="bottom")</h4><p>这是一些文本<imcg src="img/smiley.gif">这是一些文本</p><h4>图片使用align="middle"</h4><p>这是一些文本<img src="img/smiley.gif">这是一些文本</p><h4>默认对齐的图像</h4><p>这是一些文本<img src="img/smiley.gif">这是一些文本</p><h4>默认对齐的图像</h4><p>这是一些文本<img src="img/smiley.gif">这是一些文本</p><p><b>注意</b>在HTML5中align属性已经不再支持因此也就不再写了,只能在CSS里面写</p></body>
</html>
京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有 