[TOC] >[info]通过使用 HTML，可以在文档中显示图像。 ## 一、img标签 ~~~ <img src="/Wiki/Public/images/logo.png" alt="网站LOGO" title="LOGO" width="280" height="140"> ~~~ **例子解释** * `src`源属性（src）。src 指 "source"。源属性的值是图像的 URL 地址。 * `alt`属性用来为图像定义一串预备的可替换的文本，一般用于图片加载失败时的文本提示。 * `title`鼠标移过时显示的文字。 * ` width`图片宽度。 * ` height`图片高度。 >[danger] img标签为单标签，没有结束标签 ## 二、图片知识 | 格式 | 透明度 | 动画 | 特点 | 适用场景 | | --- | --- | --- | --- | --- | | JPG/JPEG | × | × | 色彩丰富，压缩比高，画质损失小，体积小 |色彩丰富、要求 体积要小 | | PNG | √ | × | 色彩丰富，w，设置任意透明度，体积较小，但比jpg体积大一些。 IE6不支持png图片透明 | 对色彩有特殊要求、需要透明效果 | | GIF | √ | √ | 仅支持256种颜色，体积小，只有 透明和不透明两种效果 | 图片颜色少、需要透明效果 | | BMP | × | × | 色彩丰富，画质清晰，但体积偏大 | 不推荐在网页中使用 | ## 三、路径知识 ### 绝对路径 绝对路径就是指带有域名的完整路径。或者从盘符开始，具体的目标位置。 比如"中国广东省广州市番禺区丽景华苑4座201"这就是一个生活动中的经典" 绝对"方式的描述 ### 相对路径 相对路径则是从当前目录说起，参照起点为本文件。 相对于本目录`<a href="./1.html">本目录下页面</a>`。 相对于上级目录`<img src="../meinv.jpg" title="美女" />`。 >[danger] **作业：**在网页中分别会绝对路径和相对路径插入不同的图片。