Menu de acesso

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

Resolvido Menu de acesso

Mensagem por kakakoro em 22/05/13, 01:07 pm

Qual é minha questão:


Olá, gostaria de saber qual o codigo para fazer um menu de acesso igual este do forum abaixo. Obrigado!



http://mermora-online.forumeiros.com/

Endereço do meu fórum:
Www.jogodostronos.forumeiros.com

Versão do fórum:
PHPBB3


Última edição por kakakoro em 22/05/13, 10:42 pm, editado 1 vez(es)
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Menu de acesso

Mensagem por ™David™ em 22/05/13, 02:20 pm

olá este é o codigo

Código:
<div class="panel introduction"><div class="inner"><span class="corners-top"><span></span></span><div class="h3">Menu de acesso</div><div class="mes-txt"><div style="width: 500px; padding: 15px; margin: 0 auto; background-color: #616161;">

<style type="text/css">.anotaciones {float:right; width:160px; font-family: 'Gentium Basic', serif; font-size:12px; text-align: center; background-color: #101010; border: 2px #616161 solid; padding-top:3px; padding:3px; color: #101010; text-transform: uppercase; overflow: hidden; -moz-transition:all 1.5s ease-in-out; -webkit-transition:all 1s ease-in-out; } .anotaciones:hover {float:right; width:160px; font-family: 'Gentium Basic', serif; font-size:12px; text-align: center; background-color: #616161; border: 2px #101010 solid; color: #101010; padding-top:3px; padding:3px; text-transform: uppercase; -moz-transition:all 0.5s ease-in-out; -webkit-transition:all 0.5s ease-in-out; } </style><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t6-regras-provisorio">Regras</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t3-classes-do-jogo">Classes</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t2-atributos-e-pontos">Atributos</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t9-trama-e-enredo">História</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t5-requisitos-minimos-em-uma-ficha-de-personagem#5">Ficha de Personagem</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t10-pericias-e-habilidades">Perícias e Habilidades</a></div><div style="text-align: center; font-size: 40px; font-family: 'Gentium Basic', cursive; color: #A2A496; text-transform:uppercase; letter-spacing: 2px; padding-bottom:5px;">Menu</div><div style="text-align: center; font-size: 34px; font-family: Gentium Basic', cursive; color: #5F6553; text-transform:uppercase; letter-spacing: 2px; padding-bottom:5px;"> de Acesso </div>

</div></div><span class="corners-bottom"><span></span></span></div></div>
avatar

™David™
Usuário avançado

Masculino
Inscrito dia : 13/01/2013
Mensagens : 426
Pontos Ativos : 624

Ver perfil do usuário http://cheatsgo.forum-pro.net/ http://facebook.com/DavidGabrielOficial http://twitter.com/DavidAlmeidaOn

Resolvido Re: Menu de acesso

Mensagem por kakakoro em 22/05/13, 04:10 pm

Olá,. funcionou perfeitamente. Mas voce pode me ajudar em outra coisa? Eu queria saber o que pode ser alterado nesse codigo. O que é imagem e etc. Brigado
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Menu de acesso

Mensagem por Gaaratsu em 22/05/13, 04:41 pm

Saudações senhor!

O código CSS é este:
Código:
.anotaciones {float:right; width:160px; font-family: 'Gentium Basic', serif; font-size:12px; text-align: center; background-color: #363636; border: 2px #4F4F4F solid; padding-top:3px; padding:3px; color: #4F4F4F; text-transform: uppercase; overflow: hidden; -moz-transition:all 1.5s ease-in-out; -webkit-transition:all 1s ease-in-out; } .anotaciones:hover {float:right; width:160px; font-family: 'Gentium Basic', serif; font-size:12px; text-align: center; background-color: #8B6914; border: 2px #101010 solid; color: #8B4513; padding-top:3px; padding:3px; text-transform: uppercase; -moz-transition:all 0.5s ease-in-out; -webkit-transition:all 0.5s ease-in-out; }

O senhor poderá implementa-lo em sua folha de estilo CSS.
Para isto, aceda à sua "Folha de estilo CSS": Painel de Controle :seta2: Visualização :seta2: Imagens e Cores :seta2: Cores :seta2: Aba 'Folha de estilo CSS'
Para modificar o estilo do 'menu de acesso', é pelo código CSS que lhe indiquei acima. Basta usar sua criatividade e modificar como desejado. Muito feliz

Atenciosamente! Piscada
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7499

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Menu de acesso

Mensagem por kakakoro em 22/05/13, 04:54 pm

Eu coloquei ele na mensagem de inicio do forum e os widget sumiram. Como posso colocar o menu e os widgetS?
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Menu de acesso

Mensagem por Gaaratsu em 22/05/13, 04:57 pm

Saudações novamente senhor!

Adentrei em seu fórum e os widgets constam em meu navegador. Poderia enviar-nos uma print screen? No caso, lhe aconselho limpar o seu cachê e/ou adentrar por outro navegador.

Substitua o código passado pelo nosso amigo, por este:
Código:
<div class="panel introduction"><div class="inner"><div class="h3">Menu de acesso</div><div class="mes-txt"><div style="width: 500px; padding: 15px; margin: 0 auto; background-color: #616161;">

<div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t6-regras-provisorio">Regras</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t3-classes-do-jogo">Classes</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t2-atributos-e-pontos">Atributos</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t9-trama-e-enredo">História</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t5-requisitos-minimos-em-uma-ficha-de-personagem#5">Ficha de Personagem</a></div><div class="anotaciones"><a href="http://mermora-online.forumeiros.com/t10-pericias-e-habilidades">Perícias e Habilidades</a></div><div style="text-align: center; font-size: 40px; font-family: 'Gentium Basic', cursive; color: #A2A496; text-transform:uppercase; letter-spacing: 2px; padding-bottom:5px;">Menu</div><div style="text-align: center; font-size: 34px; font-family: Gentium Basic', cursive; color: #5F6553; text-transform:uppercase; letter-spacing: 2px; padding-bottom:5px;"> de Acesso </div>

</div></div></div></div>

Mas lembre-se de colocar o código CSS que recomendei em minha mensagem anterior na sua Folha de estilo CSS.

Atenciosamente! Piscada
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7499

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Menu de acesso

Mensagem por kakakoro em 22/05/13, 05:02 pm

Ok, mas me ensina como troca aquele fundo cinza do menu e troco a cor da letra e do fundo quando o mouse fica por cima.
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Menu de acesso

Mensagem por Gaaratsu em 22/05/13, 05:11 pm

Saudações novamente!

Modifique o seu CSS para este:
Código:
.anotaciones {float:right; width:160px; font-family: 'Gentium Basic', serif; font-size:12px; text-align: center; background-color: #101010; border: 2px #616161 solid; padding-top:3px; padding:3px; color: #101010; text-transform: uppercase; overflow: hidden; -moz-transition:all 1.5s ease-in-out; -webkit-transition:all 1s ease-in-out; } .anotaciones:hover {float:right; width:160px; font-family: 'Gentium Basic', serif; font-size:12px; text-align: center; background-color: #616161; border: 2px #101010 solid; color: #101010; padding-top:3px; padding:3px; text-transform: uppercase; -moz-transition:all 0.5s ease-in-out; -webkit-transition:all 0.5s ease-in-out; }

Para a cor cinza, procure no CSS por "#616161" e modifique para a cor desejada. Para a cor da letra, procure no código HTML "#A2A496" e modifique para a cor desejada. Procure por ".anotaciones:hover {" no CSS para modificar a cor e o fundo quando o mouse fica por cima.

Atenciosamente! Piscada


GaaratsuAjudeiro
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7499

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Menu de acesso

Mensagem por kakakoro em 22/05/13, 05:35 pm

Oi, amigo! Então, os widget desceram lá pra baixo da pagina. Ficou desconfigurado... :/
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Menu de acesso

Mensagem por kakakoro em 22/05/13, 05:38 pm

Bem, agora resolveu. Obrigado amigo! E até mais!
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum