html常用标签之图像标签和路径

一、图像标签

在HTML标签中，<img>标签用于定义HTML页面中的图像。

例如：

<img src="图像URL"/>

src是<img>标签的必须属性，它用于指定图像文件的路径和文件名。所谓属性就是属于这个图像标签的特性。
图像要和其所运行的html放在同一目录下。

图像标签的其他属性：

例如：

<h4>图像标签的使用：</h4>
<img src="weiwuxian.jpg"/>

<h4>alt 替换文本 图片显示不出时用文字替换：</h4>
<img src="weiwuxian1.jpg" alt="魏无羡"/>

<h4>title 提示文本 鼠标放到图片上，提示的文字：</h4>
<img src="weiwuxian.jpg" alt="魏无羡" title="魏无羡"/>

<h4>width 给图片设定宽度：</h4>
<img src="weiwuxian.jpg" alt="魏无羡" title="魏无羡" width="800"/>

<h4>height 给图像设定高度：</h4>
<img src="weiwuxian.jpg" alt="魏无羡" title="魏无羡" width="800" height="500"/>

<h4>border 给图像设定边框：</h4>
<img src="weiwuxian.jpg" alt="魏无羡" title="魏无羡" width="800" border="15"/>

宽度和高度一般设置其中一个即可，另一个也会随着比例进行修改。

注意：
1.图像标签可以拥有多个属性，必须写在标签名后面。
2.属性之间不分先后顺序，标签名与属性、属性与属性之间均以空格分开。
3.属性采取键值对的格式，即key="value"的格式，属性="属性值”。

二、路径

1.目标文件夹和根目录
实际工作中，我们的文件不能随便乱放，否则用起来很难快速的找到他们，因此我们需要一个文件夹来管理他们。
目录文件夹：就是普通文件夹，里面只不过存放了我们做页面所需要的相关素材，比如html文件、图片等。

根目录：打开目录文件夹的第一层就是根目录。

2.路径
页面中的图片会非常多，通常我们会新建一个文件夹来存放这些图像文件(images)，这时再查找图像，就需要采用“路径”的方式来指定图像文件的位置。
路径可以分为相对路径和绝对路径。
(1)相对路径：
以引用文件所在位置为参考基础，而建立出的目录路径。即图片相对于HTML页面的位置。

(2)绝对路径：
是指目录下的绝对位置，直接到达目标位置，通常是从盘符开始的路径。
（去microsoft edge中随意一个网站找到一个图片右键选择复制图片链接）