网页中经常会看到图像, 通过使用<img>标签可以完成这样的功能

一. <img>标签基本用法

<img src="a.jpg">

说明:

• src属性是必须属性, 是这个图像的URL地址. 可以是相对地址也可以是绝对地址.意义同<a>标签的href一样.

• <img>标签是自关闭标签, 不需要专有的的结束标签.

二. 支持的图像格式

三. 其他常用属性

3.1 alt属性

当图片无法显示的时候, 会用alt的值来替换. 无法显示有可能是网络问题, 也可能是URl地址错误等.

没有b.jpg这个文件:

<img src="a.jpg" alt="瞧你那破图,显示不出来了吧">

3.2 width和height属性

这两个属性来设置图片的宽和高. 如果不设置则是使用图片的原始宽高来显示.

一般只设置其中的一个, 则另外一个方向的尺寸会进行等比例的缩放.

如果两个都设置, 则会引起图片的拉伸.

<img src="a.jpg" alt="瞧你那破图,显示不出来了吧" width="200">
<img src="a.jpg" alt="瞧你那破图,显示不出来了吧" width="300">
<img src="a.jpg" alt="瞧你那破图,显示不出来了吧" width="300" height="300">

注意:

• 200表示200像素. HTML5中单位只能是像素. 在HTML4中也可以使用百分比(是相对于父容器宽或高的百分比).

• 图片的宽高属性也可以在css中设置.