如何在HTML中显示数据库图片 - 使用相对路径和绝对路径

如何在HTML中显示数据库图片 - 使用相对路径和绝对路径\n\n要在HTML中显示图片，你需要将图片的路径放入src属性中。在这种情况下，如果图片tomato.jpg位于与HTML文件相同的文件夹中，你可以使用相对路径来指向它。\n\n例如，如果你的HTML文件和图片都位于根目录下，你可以将src属性设置为'tomato.jpg'，如下所示：\n\nhtml\n<div class='box' th:each='good:${GoodsList}'>\n <div class='image'>\n <img src='tomato.jpg' alt='Tomato'>\n </div>\n</div>\n\n\n确保在<img>标签中添加了alt属性，以提供图片的替代文本。这对于无法加载图片或者屏幕阅读器用户来说是非常重要的。\n\n如果图片不在与HTML文件相同的文件夹中，你可以使用相对或绝对路径来指向它。相对路径是相对于HTML文件的位置，而绝对路径是从根目录开始的完整路径。\n\n例如，如果图片tomato.jpg位于与HTML文件相同的文件夹中的images文件夹中，你可以使用相对路径来指向它：\n\nhtml\n<div class='box' th:each='good:${GoodsList}'>\n <div class='image'>\n <img src='images/tomato.jpg' alt='Tomato'>\n </div>\n</div>\n\n\n如果图片位于根目录下的images文件夹中，你可以使用绝对路径来指向它：\n\nhtml\n<div class='box' th:each='good:${GoodsList}'>\n <div class='image'>\n <img src='/images/tomato.jpg' alt='Tomato'>\n </div>\n</div>\n\n\n确保替换images/tomato.jpg或/images/tomato.jpg为实际的图片路径。