falost 发表于 2016-3-22 12:22:13

HTML图片(IMG)《四》

插入图片网页中常用的图片格式有:jpg、gif、png等。HTML中插入图片使用<img>标签
基本语法:<imgsrc=“图片路径” width=宽度 height=高度>
语法解释:宽度和高度的单位都是像素,<img>是插入图片的HTML标签,src 是描述图片路径的属性,它的值表示图片的路径。举例:< imgsrc=“bg.jpg”/ >
这里的图片路径表示bg.jpg图片和html文件在同一目录下.如果图片很多的话合理的做法是把所有的图片放在images子文件夹中显着整洁.那么上面的路径应改为<img src=”images/bg.jpg” />,关于路径问题,在后面”相对路径与绝对路径”课程中详细讲到.<img>标签除了src属性外还包括的属性有:
[*]lowsrc:设定分辩率比较低的图片
[*]alt:设定图像的提示文字属性
[*]width、height:设定图像的宽度和高度
[*]border:设定图片的边框
[*]vspace:设定图像的垂直间距
[*]hspace:设定图像的水平间距
[*]align:设定图像的排列属性
设定图片的提示文字(alt )基本语法:<imgsrc=“图片路径” alt=“提示文字”>
举例:<img src=“images/1.jpg”alt=“北国风光”>
IMG标签的alt属性是指鼠标放在网页的图片上没弹出一行提示性的文字。设定图片的边框border基本语法:<imgsrc=“图片路径” border=边框宽度>
举例:<img src=“images/1.jpg”border=10>
设定图片的排列属性(align)
图片的超链接图片的超链接就是在图片上建立链接。和文字的链接相同,就是点击过链接的图片或文字后就会跳到对应的目标地址上。图片的超链接与文字相同都是标记。基本语法:<a href=”目标地址”><img src=”图片路径” /> </a>
举例:<a href=“http://bbs.fedte.cc”><img src=”aaa.jpg”>Web开发</a>
本节总结
<html>
    <head><title>插入图片演示</title></head>
<body>
   <h1>插入IMG图片标签演示</h1>
   <img src="img.jpg" height="180" width="320" border="10" alt="熊猫宝宝"/>
</body>
</html>
   

页: [1]
查看完整版本: HTML图片(IMG)《四》