Na aula sobre Rodapé, inclui o arquivo JPG de background como na vídeo-aula, mas notei que quando passo o mouse sobre os blocos de produtos o JPG de background também se movimenta. Como faço para deixa JPG de background fixo?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Na aula sobre Rodapé, inclui o arquivo JPG de background como na vídeo-aula, mas notei que quando passo o mouse sobre os blocos de produtos o JPG de background também se movimenta. Como faço para deixa JPG de background fixo?
Olá Diego, você pode utilizar a propriedade background-attachment : fixed ; se você quer o background fixo em relação a viewport. Se você quiser o background fixo em relação ao conteúdo do elemento você deve usar background-attachment: local;.
Oi Ially, tentei das duas formas, mas não deu certo. Talvez eu tenha feito algo errado e não estou descobrindo o que.
E parte do código escrito no style.css:
footer {
text-align: center;
background: url("bg.jpg");
background-attachment: fixed;
padding: 40px 0;
}Poxa Diego, infelizmente não sei o que houve. Sempre usei essas propriedades com esses valores e dava certo. Outra propriedade que talvez resolva é o background-position, que é em relação ao ajuste de posição da imagem de fundo na viewport. Ele pode receber essas sintaxes, por exemplo:
background-position: top; background-position: bottom; background-position: left; background-position: right; background-position: center; background-position: 25% 75%;
Tenta usar em conjunto as três: background-position, background-image e background-attachment.