Entrar
Os membros mais ativos do mês
Nenhum usuário |
Quem está conectado?
Há 3 usuários online :: 0 registrados, 0 invisíveis e 3 visitantes Nenhum
[ Ver toda a lista ]
O recorde de usuários online foi de 23 em Seg Jun 08, 2020 3:43 am
Últimos assuntos
[TUTORIAL] Legenda elegante
Web ASA Fórum | Oficial :: Geral :: :: Serviços Web Sites :: Suporte Forumeiros :: Forumeiros & Você :: Tutoriais, dicas e astúcias :: Scripts CSS
Página 1 de 1
[TUTORIAL] Legenda elegante
[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem] | 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
Legenda Elegante
1º - 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)
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
2º - Código:
#picture_legend {
background-position: center;
background-repeat: no-repeat;
background: url(URL da imagem escolhida) no-repeat 50% 0;
}
Vermelho Em vez de " URL da imagem escolhida " devemos colocar o endereço real de nossa imagem.
3º - 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:
Resultado:#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;}
(clique na imagem para aumentar)
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
--> FAQ do Tutorial <--
Legenda Elegante
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
Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [Dúvida] Legenda Elegante |
Tópicos semelhantes
» [Tutorial] Explodir presente no habbo [Tutorial}
» [TUTORIAL] Logo rotativo
» [TUTORIAL] Logo aleatório
» [TUTORIAL] Enfeites de natal
» [TUTORIAL] O que são bots e sua finalidade
» [TUTORIAL] Logo rotativo
» [TUTORIAL] Logo aleatório
» [TUTORIAL] Enfeites de natal
» [TUTORIAL] O que são bots e sua finalidade
Web ASA Fórum | Oficial :: Geral :: :: Serviços Web Sites :: Suporte Forumeiros :: Forumeiros & Você :: Tutoriais, dicas e astúcias :: Scripts CSS
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos
|
|
Dom Jun 24, 2012 11:15 am por Alisson Silva
» [Re-Apresentação] Fábio
Sex maio 25, 2012 4:45 pm por Fábio
» PixelZIP ~ design&programção em só lugar
Sex maio 25, 2012 4:44 pm por Fábio
» Pedido de logo
Dom maio 20, 2012 10:06 am por Alisson Silva
» Kernel - Apresentação
Sáb maio 19, 2012 9:49 am por Alisson Silva
» [Galeria] Gabriel Schiavi - Atualizado (20/02 - !5:21)
Sáb maio 19, 2012 9:48 am por Alisson Silva
» HEBBO HOTEL 24 HORAS ONLINE !!
Sex maio 04, 2012 7:20 pm por Alisson Silva
» Pedido de Layout
Sex maio 04, 2012 5:23 pm por Fonsecca
» [RESOLVIDO]TV CCE HPS 2071-D (IMAGEM SÓ EMBAIXO, ACIMA, LINHAS DE RETRAÇO E FAIXA PRÊTA NO TOPO DA TELA).
Qua Abr 11, 2012 4:07 pm por Fry
» [contato] Deixo aqui meus contatos virtuais
Qua Abr 11, 2012 3:25 pm por Fry