Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Como personalizar o menu assim
4 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Como personalizar o menu assim
Qual é minha questão:
Bem, gostaria de saber como faz um menu assim? :
http://demo.nicetheme.com/forum?theme_id=182355
Obs: Não é por meio de Imagens...
Endereço do meu fórum:
http://heroesofolympus.forumeiros.com
Versão do fórum:
PHPBB2
Bem, gostaria de saber como faz um menu assim? :
http://demo.nicetheme.com/forum?theme_id=182355
Obs: Não é por meio de Imagens...
Endereço do meu fórum:
http://heroesofolympus.forumeiros.com
Versão do fórum:
PHPBB2
Última edição por Chrome' em 07.04.14 17:44, editado 1 vez(es)
Re: Como personalizar o menu assim
tente
- Código:
#page-header .navbar ul.linklist {
border-bottom: 0px;
margin-bottom: -4px;
}
#page-header .navbar ul.navlinks {
width: 962px;
height: 36px;
background: url(http://i49.servimg.com/u/f49/16/79/58/45/ie_nav10.png) 50% 0% no-repeat;
left: -30px;
position: relative;
border-bottom: 0px solid rgb(178, 209, 237);
margin-bottom: -100px;
}
#page-header ul.navlinks {
top: -10px;
position: relative;
}
#page-footer, div.navbar, div.navbar ul.linklist {
display: block !important;
}
ul.navlinks {
border-bottom: 1px solid rgb(255, 208, 158);
font-weight: 700;
text-align: center;
}
Re: Como personalizar o menu assim
- Código:
.bodyline {
-moz-box-shadow: 0px 3px 20px #000000;
-webkit-box-shadow: 0px 3px 20px #000000;
}
a:link,a:active,a:visited {
text-decoration: none;
}
blockquote {
border: 2px solid #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
.post {
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
.button2, .button3{
border: 2px solid #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
cite {
border-radius: 10px 10px 0px 0px;
-moz-border-radius: 10px 10px 0px 0px;
-webkit-border-radius: 10px 10px 0px 0px;
}
.spoiler {
border: 2px solid #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
.spoiler dt {
border-radius: 10px 10px 0px 0px;
-moz-border-radius: 10px 10px 0px 0px;
-webkit-border-radius: 10px 10px 0px 0px;
}
.button2{-moz-border-radius:8px;-webkit-border-radius:8px;border-radius:8px}.codebox{-moz-border-radius:10px;-webkit- border-radius:10px;border-radius:10px}
a.mainmenu img {
filter:alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 0.4;
}
a.mainmenu img:hover {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}
a:hover {
color: #0000FF;
text-shadow : 0px 0px 15px #000000;
}
/*Menu*/
#page-header .navbar ul.linklist {
border-bottom: 0px;
margin-bottom: -4px;
}
#page-header .navbar ul.navlinks {
width: 962px;
height: 36px;
background: url(http://i49.servimg.com/u/f49/16/79/58/45/ie_nav10.png) 50% 0% no-repeat;
left: -30px;
position: relative;
border-bottom: 0px solid rgb(178, 209, 237);
margin-bottom: -100px;
}
#page-header ul.navlinks {
top: -10px;
position: relative;
}
#page-footer, div.navbar, div.navbar ul.linklist {
display: block !important;
}
ul.navlinks {
border-bottom: 1px solid rgb(255, 208, 158);
font-weight: 700;
text-align: center;
}
Re: Como personalizar o menu assim
Substitua por
Até Mais
- Código:
.bodyline {
-moz-box-shadow: 0px 3px 20px #000000;
-webkit-box-shadow: 0px 3px 20px #000000;
}
a:link,a:active,a:visited {
text-decoration: none;
}
blockquote {
border: 2px solid #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
.post {
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
.button2, .button3{
border: 2px solid #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
cite {
border-radius: 10px 10px 0px 0px;
-moz-border-radius: 10px 10px 0px 0px;
-webkit-border-radius: 10px 10px 0px 0px;
}
.spoiler {
border: 2px solid #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
}
.spoiler dt {
border-radius: 10px 10px 0px 0px;
-moz-border-radius: 10px 10px 0px 0px;
-webkit-border-radius: 10px 10px 0px 0px;
}
.button2{-moz-border-radius:8px;-webkit-border-radius:8px;border-radius:8px}.codebox{-moz-border-radius:10px;-webkit- border-radius:10px;border-radius:10px}
a.mainmenu img {
filter:alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 0.4;
}
a.mainmenu img:hover {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}
a:hover {
color: #0000FF;
text-shadow : 0px 0px 15px #000000;
}
/*Menu*/
#page-header .navbar ul.linklist {
border-bottom: 0px;
margin-bottom: -4px;
}
#page-header .navbar ul.navlinks {
width: 962px;
height: 36px;
background: url(http://i49.servimg.com/u/f49/16/79/58/45/ie_nav10.png) 50% 0% no-repeat;
left: -30px;
position: relative;
border-bottom: 0px solid rgb(178, 209, 237);
margin-bottom: -100px;
}
#page-header ul.navlinks {
top: -10px;
position: relative;
}
#page-footer, div.navbar, div.navbar ul.linklist {
display: block !important;
}
ul.navlinks {
border-bottom: 1px solid rgb(255, 208, 158);
font-weight: 700;
text-align: center;
}
#page-header .navbar ul.navlinks {
width: 962px;
height: 36px;
background: url('http://i49.servimg.com/u/f49/16/79/58/45/ie_nav10.png') no-repeat top center;
left: -30px;
position: relative;
border-bottom: 0px solid #b2d1ed;
margin-bottom: -100px;
}
Até Mais
Re: Como personalizar o menu assim
Olá novamente, este CSS proposto pelo senhor, ainda não funcionou...
Re: Como personalizar o menu assim
Olá,
O senhor terá que desativar o menu das imagens e ativar o menu de textos, siga os passos:
CPainel ->> Visualização ->> Página inicial ->> Cabeçalho e navegação
Em "Exibir apenas as imagens no menu de navegação" marque a opção não e salve!
Feito isto, aconselho a retirar as imagens do menu.
Agora podemos adicionar o CSS utilizado no estilo do menu. Aceda a folha de estilo CSS:
Até mais.
#Título do tópico alterado!
O senhor terá que desativar o menu das imagens e ativar o menu de textos, siga os passos:
CPainel ->> Visualização ->> Página inicial ->> Cabeçalho e navegação
Em "Exibir apenas as imagens no menu de navegação" marque a opção não e salve!
Feito isto, aconselho a retirar as imagens do menu.
Agora podemos adicionar o CSS utilizado no estilo do menu. Aceda a folha de estilo CSS:
- Código:
#page-header .navbar ul.navlinks {
width: 962px;
height: 36px;
background: url(http://i49.servimg.com/u/f49/16/79/58/45/ie_nav10.png) 50% 0% no-repeat;
left: -30px;
position: relative;
border-bottom: 0px solid rgb(178, 209, 237);
margin-bottom: -100px;
}
#page-header .navbar ul.linklist li a {
color: rgb(255, 255, 255);
font-size: 13px;
text-align: center;
text-shadow: rgb(85, 85, 85) 0.1em 0px 0.2em;
}
Até mais.
#Título do tópico alterado!
Re: Como personalizar o menu assim
Olá,
Troque o código passado por este:
Troque o código passado por este:
- Código:
.bodyline table:nth-of-type(2) td {
background: url("http://i49.servimg.com/u/f49/16/79/58/45/ie_nav10.png") no-repeat scroll center top rgba(0, 0, 0, 0);
border-bottom: 0 solid #B2D1ED;
height: 36px;
left: -30px;
margin-bottom: -100px;
position: relative;
width: 962px;}
.bodyline {
-moz-box-shadow: 0px 3px 20px #000000;
-webkit-box-shadow: 0px 3px 20px #000000;
}
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos