HTML 图片

<img> 标签定义图像。

  • <img> 是空标签,意思是说,它只包含属性,并且没有闭合标签。
  • 图片显示用源属性 src ,源属性的值是图像的 URL 地址。
  • URL 指存储图像的位置。如果名为 "boat.gif" 的图像位于 www.pangugle.com 的 images 目录中,那么其 URL 为 https://www.pangugle.com/images/boat.gif。
<img src="https://www.pangugle.com/images/boat.gif" alt="图片">

alt 替换文本属性 :

在浏览器无法载入图像时显示替换文本的内容。添加 alt 是个好习惯,这样有助于更好的显示信息。

替换文本

图一
注:假如某个 HTML 文件包含十个图像,那么为了正确显示这个页面,需要加载 11 个文件。加载图片是需要时间的,所以慎用图片。

HTML 图片实例

设置图像的高度与宽度 :

<img src="" alt="pangugle 教程图片" width="100" height="100">
注:如果图像指定了高度宽度,页面加载时就会保留指定的尺寸。如果没有指定图片的大小,加载页面时有可能会破坏HTML页面的整体布局。后面学习样式后,可用样式控制图片宽高。

图片链接:

<a href="https://www.pangugle.com/">
  <img  border="10" src="img/emotion.png" alt="pangugle教程,HTML 教程" width="32" height="32">
</a>