CSS: Background adaptável a resolução da tela

Bom dia pessoal,

Hoje trago para vocês um artigo sobre CSS, um assunto que tive necessidade de aprender a usar, o background do site que se adapta a resolução da tela. Existem outros modos de se fazer a mesma coisa, mas para mim o melhor e mais simples foi este:

<!DOCTYPE html>
<html lang="pt-br">
<head>
<title>Background tela</title>
 <style type="text/css">
 .back{
 width:100%;
 height:100%;
 position:absolute;
 z-index:-1;
 }
</style>
</head>
<body>
<img src="imagem.jpeg" class="back"/>
</body>

Como puderam ver, inseri uma imagem no site pelo html e coloquei uma classe   a classe back, no estilo defini esta classe com altura e largura de 100% e posição absoluta, tomando assim toda a tela, e por último o z-index:-1 para colocar esta classe um nível abaixo, possibilitando inserir conteúdo sobre ela, como outras div’s.

É isso aí espero ter colaborado, até a próxima.

Anúncios

, , , , , , ,

  1. Deixe um comentário

Deixe uma Resposta

Preencha os seus detalhes abaixo ou clique num ícone para iniciar sessão:

Logótipo da WordPress.com

Está a comentar usando a sua conta WordPress.com Terminar Sessão / Alterar )

Imagem do Twitter

Está a comentar usando a sua conta Twitter Terminar Sessão / Alterar )

Facebook photo

Está a comentar usando a sua conta Facebook Terminar Sessão / Alterar )

Google+ photo

Está a comentar usando a sua conta Google+ Terminar Sessão / Alterar )

Connecting to %s

%d bloggers like this: