~NatyBelleville

NatyBelleville
Mal feito, feito.
Nome: Nataly
Status: Usuário Veterano
Sexo: Indisponivel
Localização: Indisponivel
Aniversário: 13 de Janeiro
Idade: 66
Cadastro:

(Sobre Style) Modelo de Banner Que Eu Uso - Mini Tutorial de como usar | Especial


Postado

Bom dia! Ou boa Noite! Ou boa tarde!
Nesse Jornal eu apresento a Base Banner que eu uso para todos os Meus Styles. Basicamente, é o "fundo" de todo meu Style e que posso fazer diversas modificações do photoshop sem precisar de códigos (Obviamente)

Veja alguns Exemplos pra você ter uma certa noção do que eu estou falando:



Então, vamos começar com a aula! Vai ser rápido e fácil

Eu passarei um modelo para vocês poderem usar livremente!


Passo 1:
Depois de editar o Banner, você vai guardar isso em qualquer site que guarde imagem, e pegará o link (normal, como você sempre fez). Após isso, você vai colá-lo aqui:
Citação:
#fundo {
background:url(LINK DA IMAGEM) no-repeat center top;
}


Logo, ele vai aparecer desse jeito:

Não se preocupe, vamos arrumar isso no decorrer do tutorial :)

Passo 2:
Acredito que essa parte seja importante, mas eu nunca a usei, então eu simplesmente a faço sumir do Style:
Citação:
#base {
background: url() no-repeat center top;
}


Passo 3
Precisamos dar "continuidade" para o nosso Style:


Essa é uma parte fácil. Você simplesmente recorta a parte do seu modelo. Eu corto uma "fatiazinha" mesmo...



Guarda e pega o link de novo!
Logo depois, cole aqui:
Citação:
body {
background: #DFDFDF url(LINK DA "FATIA") repeat-Y center center;
}


E você verá que vai dar continuidade por todo o Style ^^

Passo 4:
Agora, uma parte bem importante: O CimaLogo
Você vai cortar no mesmo esquema que cortou sua "Fatia" (Lembre que o CimaLogo tem que estar do tamanho de 350px, nada mais, nada menos)



Logo depois que você cortar, com as devidas medidas,você cola simplesmente aqui:

Citação:
#cima #logo {
height: 350px;
background: url(LINK DA IMAGEM DO CIMALOGO);
}


E PRONTO! TEMOS UM FUNDO STYLE PERFEITO E PRONTO PRA SER FINALMENTE EDITADO!


Finalmente você vai poder usar e abusar dos códigos e fazer um lindo Style!

Obrigado pela sua paciência de ler isso e ter entendido tudo, foi realmente trabalhoso ^^
Qualquer dúvidas, tamos aí.

TCHAU!!

Agradeço o @Uziel pelo Modelo ^^


Gostou da Jornal? Compartilhe!

Gostou? Deixe seu Comentário!

Muitos usuários deixam de postar por falta de comentários, estimule o trabalho deles, deixando um comentário.

Para comentar e incentivar o autor, Cadastre-se ou Acesse sua Conta.


Carregando...