-2

Estou fazendo um slide em tela full, más me deparo que em outros monitores a imagem e o texto fica maiores/menores. Gostaria de deixar ele tamanho único.

Vi este site abaixo, achei muito interessante. Percebe-se que mesmo aumentando/diminuindo o zoom os textos e imagem permanecem fixo.

Alguém tem uma sugestão para mim?

1
  • Isso é um e-learning. Parece que foi feito no Edge, Articulate ou Captivate. 18/01/2017 às 13:46

1 Resposta 1

0

Jogue o seguinte css na div da imagem:

.imagem{
    width: 100%;
    height: 100vh;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

Width 100% fará com que a imagem pegue toda a largura da tela, o height 100vh, fará com que será pego toda a altura da tela, indiferente do tamanho, 100vh, são 100 pontos da tela, caso tenha dúvidas sobre vh Clique aqui.

Background-size cover fará com que a imagem se ajuste ao tamanho inserido, background position center irá mantê-la no meio da tela e o background-repeat fará com que a imagem não repita, seja exibida somente uma vez.

Lembrando que a imagem deverá estar de fundo, exemplo:

<div class="imagem" style="background-image: url(localimagem/imagem.jpg);"></div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .