跳到主要内容

HTML 图片

img元素用于在网页中展示图片。

<img src="tree.jpeg" />
about:blank

src 属性​

src属性用来指定图片的地址。

<img src="tree.jpeg" />
<img src="golden-tree.jpeg" />

alt 属性​

alt属性可以图像提供替换文本，如果图片无法显示，则会显示该文本。

<!--不存在的图片，将无法显示-->
<p><img src="red-tree.jpeg" alt="红色树木" /></p>

<!--正常的图片，可以显示出来-->
<p><img src="tree.jpeg" alt="普通树木" /></p>
about:blank

图像尺寸​

可以使用 width 设置图片的宽度，使用 height属性设置图片的高度。

当height和width只设置其中一个值时，图片按比例缩放，两个属性都设置时按设置的值缩放。

<p><img src="tree.jpeg" height="50" width="50" alt="普通树木" /></p>

<p><img src="tree.jpeg" height="50" width="100" alt="普通树木" /></p>

<p><img src="tree.jpeg" width="100" alt="普通树木" /></p>
<p><img src="tree.jpeg" height="150" alt="普通树木" /></p>
about:blank

也可以使用CSS的height和width属性设置，效果跟HTML属性一样：

<p><img src="tree.jpeg" style="height: 50px;width:50px;" alt="普通树木" /></p>

about:blank

HTML 参考​

名称描述