如何在HTML中加载本地图片
在网页设计与开发中，图片是非常重要的元素之一，可以让网页更加美观、生动，也可以更好地传达信息。在HTML中，想要在网页中使用图片，可以使用以下两种方式：
1. 使用URL地址引入网络图片
这是最常使用的一种方式，直接使用标签，并在src属性中引入网络图片的URL地址即可。如下所示：
<img src="https://example.com/images/picture.jpg" alt="图片描述">
在上面的代码中，src属性引入了网络图片的URL地址，alt属性用于给图片添加描述，当图片无法显示或加载时，将会显示该描述文字。
2. 使用本地磁盘路径引入本地图片
另一种方式是使用本地磁盘路径引入本地图片，这种方式在开发测试时比较便捷，但在实际发布网页时则需要上传图片到服务器，否则其他用户无法访问到该图片。如下所示：
<img src="file:///C:/images/picture.jpg" alt="图片描述">
在上面的代码中，src属性引入了本地磁盘路径下的图片文件，alt属性同样用于给图片添加描述。
然而，在实际开发中，使用本地路径引入本地图片并不一定是最好的选择。因为本地路径容易受到浏览器的安全限制，如果想要在网页中使用本地图片，需要遵循以下几点要求：
3. 遵循浏览器安全策略
在HTML5及更高版本中，限制了HTML页面中使用本地图片的路径，遵循浏览器的同源策略，只允许页面加载与页面本身位于同一目录下或子目录下的图片资源。因此，在实际操作中，需要将所有图片资源放在网站根目录下的一个子目录中，例如：
<img src="/images/picture.jpg" alt="图片描述">
在上面的代码中，src属性中的路径"/images/picture.jpg"指的是网站根目录下的images目录中的picture.jpg图片文件，这样就可以在所有页面中使用了。
4. 使用相对路径引入本地图片
相对路径指的是相对于当前文件所在的目录，使用相对路径引入本地图片也是一种较为常见的方式。例如，如果当前HTML页面与图片在同一目录下，则图片引用代码应该如下：
<img src="picture.jpg" alt="图片描述">
在上面的代码中，src属性引用的是当前目录下的picture.jpg图片文件，与当前HTML页面在同一目录下。
相对路径也可以在引用同级及下级目录中的图片资源时使用。例如，假设当前HTML页面与图片所在目录结构如下：
-- root
-- html
-- images
pic.jpg
-- index.html
如果想要在index.html中引用images目录中的pic.jpg图片文件，则可以使用以下相对路径方式：
<img src="../images/pic.jpg" alt="图片描述">
在上面的代码中，src属性引用的是上级目录中的images目录中的pic.jpg图片文件，"../"表示上级目录。
5. 总结
以上就是如何在HTML中加载本地图片的方法，我们可以使用网络图片或本地路径引用本地图片，在使用本地路径时要遵循浏览器的安全策略，使用相对路径可以更加灵活地操作图片资源。