“gif/image background not showing” 可以翻译为 “gif/图像背景不显示”。

huangapple go评论84阅读模式
英文:

gif/image background not showing

问题

我正在尝试将一个.gif文件设置为我正在开发的网页的背景。我尝试了几种不同的方法来使它工作,但无论如何,我仍然只得到默认的白色背景。

提前告诉你,如果我的CSS或HTML中有任何重大差异,那是因为我正在练习前端开发,而且我还是比较新手。

  1. body {
  2. background-image: url(bg.gif);
  3. background-color: black;
  4. background-position: center;
  5. background-size: cover;
  6. color: green;
  7. font-family: 'Courier New', Courier, monospace;
  8. }

这是我目前的代码。我已经尝试了一些类似的方法,包括使用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.

  1. body{
  2. background-image: url(bg.gif);
  3. background-color: black;
  4. background-position: center;
  5. background-size: cover;
  6. color: green;
  7. font-family: &#39;Courier New&#39;, Courier, monospace;
  8. }

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中添加一些高度和宽度。

  1. <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

  1. &lt;link rel=&quot;stylesheet&quot; href=&quot;style.css&quot; /&gt;

答案2

得分: 0

  1. body {
  2. background-image: url("/bg.gif"); /* 设置文件的路径。 */
  3. background-position: center;
  4. background-size: cover;
  5. color: green;
  6. font-family: 'Courier New', Courier, monospace;
  7. }
英文:
  1. body {
  2. background-image: url(&quot;/bg.gif&quot;); /* Set your path to the file. */
  3. background-position: center;
  4. background-size: cover;
  5. color: green;
  6. font-family: &#39;Courier New&#39;, Courier, monospace;
  7. }

答案3

得分: 0

以下是您要翻译的内容:

  1. body {
  2. background-image: url(https://2.bp.blogspot.com/-u10qS9b4DDQ/Ww2OlSmqNhI/AAAAAAAAAgg/U1VLjoY_zlYuQfaNOLSk6E5fZc-Yz55sQCLcBGAs/s1600/videotogif_2018.05.24_15.10.52.gif);
  3. background-size: cover;
  4. }
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. </body>
  5. </html>
英文:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

  1. body {
  2. background-image: url(https://2.bp.blogspot.com/-u10qS9b4DDQ/Ww2OlSmqNhI/AAAAAAAAAgg/U1VLjoY_zlYuQfaNOLSk6E5fZc-Yz55sQCLcBGAs/s1600/videotogif_2018.05.24_15.10.52.gif);
  3. background-size: cover;
  4. }

<!-- language: lang-html -->

  1. &lt;!DOCTYPE html&gt;
  2. &lt;html&gt;
  3. &lt;body&gt;
  4. &lt;/body&gt;
  5. &lt;/html&gt;

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年7月13日 11:58:58
  • 转载请务必保留本文链接:https://go.coder-hub.com/76675815.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定