Background-image does not appear

Asked

Viewed 59 times

-1

I hosted three images to put in my page as background-image of header, footer and in an img tag, but they do not appear. I put it this way:

.rodape{
  background-color: #000;
  background-image: url(https://ibb.co/TwVWfw5);
  background-size: 30%;
  background-position: left bottom;
  background-repeat: no-repeat;
  padding: 50px;
  height: auto;
  margin: 0;
  width:100%;
}

.cabecalho{
  background-image: url('https://ibb.co/n3y80Vq');
  padding: 0;
}

.logo{
  width: 56px;
  height: 56px;
  float:left;
}
<section class="centro">
<header class="cabecalho">
  <div class="cabecalho-container">
    <div class="cabecalho-top">
      <div>
        <img src="https://ibb.co/qnRQqss" alt="logo da pagina" class="logo">
      </div>
     </div>
    </div>
  </header>
  
  <!--conteudo da pagina-->
  
  <footer class="rodape">
<p> rodape </p>
</footer>

</section>

html css

  • You added images to the elements .cabecalho and .rodape, but in its code already only the .logo.

  • was just to show how I put the links of the images, but I’ll put the rest

  • This is the link to the image https://i.ibb.co/X4zr0ss/game-console.png, not the one you used https://ibb.co/TwVWfw5 the code is right, you did not get the correct link from the image

  • all quiet? I believe it’s the lack of quotes in the background-image, take a look here https://developer.mozilla.org/pt-PT/docs/Web/CSS/background-image I hope I’ve helped.

1 answer

0


Follow the Fiddle JS link below with the images working. Basically you needed to open the image in a new tab and get the image specific link.

Working: https://jsfiddle.net/a03m4jxf/3/

inserir a descrição da imagem aqui

Browser other questions tagged html css

You are not signed in. Login or sign up in order to post.