Foto de Ednardo M.
Ednardo há 5 anos
Enviada pelo
Site

Background image no angular não cobre toda a página

Estou tendo um probleminha quando se trata da área em que um componente ocupa. Eu trabalho com softwares para academia e estou fazendo uma tela de login, fiz um componente "Login.component", dentro fiz componentes filhos "Cpf.Componente", "Senha.component" e etc... Quero que a tela de login possua uma imagem, porém só a tela de login terá essa imagem, porém quando coloco a imagem, ela só cobre metade da tela, a outra metade é o index.html, tem alguma maneira de eu falar que o componente "Login.component" vai ocupar 100% da tela mesmo não tendo conteúdo suficiente para isso?

Professor Thiago B.
Identidade verificada
  • CPF verificado
  • E-mail verificado
Respondeu há 5 anos
Contatar Thiago

Boa tarde, Bruno.

 

O melhor seria você compartilhar seu código html e css para termos certeza, mas no geral, podes definir o width de um elemento para 100%. Isso fará com que a largura dele seja toda a largura do elemento pai. O mesmo vale para o height.

 

Claro, existem situações em que os elementos não se comportam assim, por isso seria importante você mostrar o seu código para que possamos dar uma resposta mais concreta.

 

Abraços.

Um professor já respondeu

Envie você também uma dúvida grátis
Ver resposta

Envie uma dúvida grátis

Resposta na hora da Minerva IA e de professores particulares
Enviar dúvida
Professor Jardel S.
Respondeu há 5 anos
Contatar Jardel

Apenas com estas informações não podemos lhe ajudar de forma eficiente. É preciso analisar seu código para poder apontar a solução. Vc tem whats?

Um professor já respondeu

Envie você também uma dúvida grátis
Ver resposta
Professor Angelo R.
Identidade verificada
  • CPF verificado
  • E-mail verificado
Respondeu há 5 anos
Contatar Angelo

Olá,

Você pode utilizar a unidade de medida vh e o background-size: cover do CSS 3.

Exemplo:

.my-container {

background-image: url('path_imagem_aqui');

height: 100vh;

background-size: cover;

}

Veja um exemplo aqui - https://codepen.io/angelorubin/pen/dyojXMj

Um professor já respondeu

Envie você também uma dúvida grátis
Ver resposta
Minerva IA
do Profes
Respostas na hora
100% no WhatsApp
Envie suas dúvidas pelo App. Baixe agora
Precisa de outra solução? Conheça
Aulas particulares Encontre um professor para combinar e agendar aulas particulares Buscar professor