Question 206688 in Html Question posted in
Some basic documentation can be found here.

Html – gif/image background not showing

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

Tags:

3

Answers


  1. 0

    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" />
    Login or Signup to reply.
  2. 0 
    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;
}
    Login or Signup to reply.
  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>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search