前端怎么往img里放图片

在前端开发中，将图片放入`<img>`标签是通过设置该标签的`src`属性来完成的。这个属性用于指定图片文件的路径，当网页加载时，浏览器会根据这个路径加载并显示图片。你可以通过以下几种方式来设置图片的路径：

1. 绝对路径：直接提供图片文件在服务器上的完整URL。

   <img src="http://www.example.com/images/photo.jpg" alt="图片描述">

2. 相对路径：根据当前HTML文件的位置来指定图片的位置。

   <img src="images/photo.jpg" alt="图片描述">

这种情况下，如果HTML文件和图片文件位于同一目录下，则直接指定图片文件名。

3. 根路径（根相对路径）：以网站根目录为起点的路径。

   <img src="/images/photo.jpg" alt="图片描述">

这里以斜杠`/`开头，表示路径从网站的根目录开始。

4. 使用数据URI方案：将图片数据直接嵌入到HTML中，不需要外部文件。

   <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />

这种方法适用于小图片或者测试场景，因为所有图片数据都包含在HTML文件中，可能会增加文件大小。

此外，设置`alt`属性是良好的实践，它提供了图片的文本替代描述，有助于搜索引擎优化和在图片无法显示时提供信息。