Não entendi exatamente como funciona o background-position, o valor utilizado se aplica pra qual direção?
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!
Não entendi exatamente como funciona o background-position, o valor utilizado se aplica pra qual direção?
Olá João
Bem o background-position mexe na posição inicial da imagem, que por padrão é posicionada no topo da esquerda.
Você pode mexer nesse valor e posicionar a imagem de acordo com o seu gosto dentro do espaço das tags do body, div, section, etc.
Exemplo:
.imagem {
background-image: url('suaimagem.png'); // define uma imagem de fundo
background-repeat: no-repeat; // tira a repetição da imagem para preencher o fundo inteiro
background-position: center; // centraliza a imagem dentro do espaço escolhido, por isso o center
}
tem diversas direções que você pode utilizar como: right, left, center, right top, e por ai vai...
Depois você pode ate conferir utilizando a ferramenta de inspecionar elementos como a imagem está sendo ocupada ou trocando os valores. Aqui no developer mozilla tem alguns exemplos de uso dessa propriedade CSS: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position