英文:
gif/image background not showing
问题
我正在尝试将一个.gif文件设置为我正在开发的网页的背景。我尝试了几种不同的方法来使它工作，但无论如何，我仍然只得到默认的白色背景。
提前告诉你，如果我的CSS或HTML中有任何重大差异，那是因为我正在练习前端开发，而且我还是比较新手。
body {
background-image: url(bg.gif);
background-color: black;
background-position: center;
background-size: cover;
color: green;
font-family: 'Courier New', Courier, monospace;
}
这是我目前的代码。我已经尝试了一些类似的方法，包括使用PNG图像，但没有任何方法有效。我不知道是否需要将它与Hugo链接或在我的baseof.html中添加一些内容，我的styles.css中的其他所有内容都正常工作。噢，还尝试了在HTML页面上使用<div>，但也没有成功。
英文:
I'm trying to set a .gif as a background for a webpage I'm working on. I've tried a few different things to make it work but no matter what I still just get the default white background.
> Just a heads up if there are any major discrepancies in my css or html, its because I'm doing this to practice frontend development, and I'm still rather new to it.
body{
background-image: url(bg.gif);
background-color: black;
background-position: center;
background-size: cover;
color: green;
font-family: 'Courier New', Courier, monospace;
}
this is what I have at the moment, I've tried a few similar things including using an png image but nothing has worked. I don't know if I need to link it with hugo or add something to my baseof.html, everything else in my styles css has worked fine. oh also i tried a div on the html page but that also didn't work
答案1
得分: 0
尝试检查您的HTML，确保已正确链接您的CSS或在CSS中添加一些高度和宽度。
<link rel="stylesheet" href="style.css" />
英文:
try to check your html if, you already link your css properly or put some height and width to your css
<link rel="stylesheet" href="style.css" />
答案2
得分: 0
body {
background-image: url("/bg.gif"); /* 设置文件的路径。 */
background-position: center;
background-size: cover;
color: green;
font-family: 'Courier New', Courier, monospace;
}
英文:
body {
background-image: url("/bg.gif"); /* Set your path to the file. */
background-position: center;
background-size: cover;
color: green;
font-family: 'Courier New', Courier, monospace;
}
答案3
得分: 0
以下是您要翻译的内容：
body {
background-image: url(https://2.bp.blogspot.com/-u10qS9b4DDQ/Ww2OlSmqNhI/AAAAAAAAAgg/U1VLjoY_zlYuQfaNOLSk6E5fZc-Yz55sQCLcBGAs/s1600/videotogif_2018.05.24_15.10.52.gif);
background-size: cover;
}
<!DOCTYPE html>
<html>
<body>
</body>
</html>
英文:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-css -->
body {
background-image: url(https://2.bp.blogspot.com/-u10qS9b4DDQ/Ww2OlSmqNhI/AAAAAAAAAgg/U1VLjoY_zlYuQfaNOLSk6E5fZc-Yz55sQCLcBGAs/s1600/videotogif_2018.05.24_15.10.52.gif);
background-size: cover;
}
<!-- language: lang-html -->
<!DOCTYPE html>
<html>
<body>
</body>
</html>
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论