制作 HTML 时的相对路径问题。 图片未显示
[英]Relative path problem while making HTML. The image is not shown
问题描述
The follows is the code
以下是代码
<html>
<h1 style="min-height: 5vh;background-size:cover;color:rgba(79.0,243.0,0.0,1);justify-content: center;display: flex;font-size: 5rem;align-items: center;background-image: url('User Content\abc.svg');">dasfgasdfgadfsg</h1><h1 style="min-height: 100vh;background-size:cover;color:rgba(78.0,224.0,140.0,1);justify-content: center;display: flex;font-size: 5rem;align-items: center;background-image: **url('Images\Builder Section\Heros\Plain and Simple.jpg')**;">Sample
</h1>
</html>
Can i get to know how to resolve it?我可以知道如何解决它吗？ for reference: buildeer.tk # Site for seeing the code供参考：builder.tk # 查看代码的站点
3 个解决方案
解决方案1
1 2021-03-04 11:30:55
Urls always use forward slashes: / , never backslashes: \网址总是使用正斜杠： / ，从不使用反斜杠： \
Looks to me you should be using / instead of \ as the separator within the url(...) , also, avoid using spaces within your directories names (spaces are not valid in a URI: they need to be encoded to %20 ), and do not forget to remove those ** within your css surrounding the last url(...)在我看来，您应该使用/而不是\作为url(...)中的分隔符，另外，避免在目录名称中使用空格（空格在 URI 中无效：它们需要编码为%20 ） ，并且不要忘记在最后一个url(...)周围的 css 中删除那些**
Also, unrelated, you're using two h1 , which is non-semantic, there should only be one level 1 heading within your doc此外，不相关，您正在使用两个h1 ，这是非语义的，您的文档中应该只有一个 1 级标题
解决方案2
-1 2021-03-04 11:38:05
Also if you have spaces in directory names always use %20 in place of it so the url knows that the space is part of the name and isn't a seperation此外，如果目录名称中有空格，请始终使用 %20 代替它，因此 url 知道空格是名称的一部分，而不是分隔符
解决方案3
-2 2021-03-04 11:35:00
if the image is not in the same folder, you can use ../ to navigate to the parent folder.如果图像不在同一个文件夹中，您可以使用../导航到父文件夹。
background-image: url('../Images/Builder Section/Heros/Plain and Simple.jpg')
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.