[TUTORIAL] Legenda elegante

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

[TUTORIAL] Legenda elegante Empty [TUTORIAL] Legenda elegante

Mensagem por Convidad 02.06.11 1:17

[TUTORIAL] Legenda elegante Magic Legenda Elegante
Às vezes queremos deixar o nosso fórum bonito e elegante. Neste tutorial iremos aprender a personalizar a "Picture Legenda" ou seja, personalizar a área das imagens: Novas mensagens, Não há novas mensagens e Fórum Bloqueado.


--> Tutorial <--
Legenda Elegante



- Teremos de aceder à "Folha de estilo CSS":
Para que possamos personalizar a área "Picture Legenda" é necessário adicionar códigos CSS para criarmos o efeito desejado. Sendo assim teremos de aceder a:
Painel de Controle -> Visualização -> Imagens e cores -> Cores -> Folha de estilo CSS
(clique na imagem para aumentar)
[TUTORIAL] Legenda elegante 1114

- Código:

#picture_legend {
background-position: center;
background-repeat: no-repeat;
background: url(URL da imagem escolhida) no-repeat 50% 0;
}

Vermelho :seta2: Em vez de " URL da imagem escolhida " devemos colocar o endereço real de nossa imagem.

- Vejamos um exemplo:
Veremos como irá ficar o nosso código depois de estar pronto e também poderemos ver como ficará bonito no nosso fórum.

Código:
#picture_legend {
background-position: center;
background-repeat: no-repeat;
background: url(https://2img.net/h/oi34.tinypic.com/b80g87.png) no-repeat 50% 0;
padding: 24px 0;}
Resultado:
(clique na imagem para aumentar)
[TUTORIAL] Legenda elegante Whatul10




--> FAQ do Tutorial <--
Legenda Elegante




  • Este código é para todas as versões?
    Não! Infelizmente este código só resulta na versão PhpBB3.





© Fórum dos Fóruns



[TUTORIAL] Legenda elegante Act_bottom Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
Legenda Elegante
Anonymous

Convidad
Convidado


Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos