如何在HTML中插入图片？

html

在HTML中插入图片，我们主要使用<img>标签。这个标签有几个重要的属性，其中最重要的是src，它用于指定图片的来源，可以是图片的URL，也可以是本地文件路径。此外，alt属性也是非常重要的，它用于提供图片的描述，当图片无法显示时，这个描述会被显示出来，对于提高网页的可访问性非常有帮助。

示例效果与源代码：

运行效果

1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html>
<head>
    <title>插入图片示例</title>
</head>
<body>
    <h1>欢迎来到我的网页</h1>
    <p>以下是一张图片：</p>
    <img src="image/1.jpg" alt="一个示例图片">
    <p>希望你喜欢这个示例图片。</p>
</body>
</html>

尝试一下 »

在这个示例中，<img src="example.jpg" alt="一个示例图片">就是在HTML中插入图片的代码。src="example.jpg"表示图片的来源是名为"example.jpg"的文件，这个文件应该与HTML文件在同一个目录下，或者你可以提供完整的文件路径。alt="一个示例图片"表示当图片无法显示时，将显示这个描述。

请注意，如果你使用的是一个URL作为图片的来源，那么你需要确保这个URL是有效的，并且服务器允许跨域请求（如果HTML文件和图片在不同的域中）。同时，为了提高网页加载速度，你可能还需要对图片进行优化，例如压缩图片大小，使用适当的图片格式等。

上一篇：HTML与CSS的区别有哪些？

下一篇：什么是Canvas？