Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

ricardotiso

Menus com subs

Por , em Desenvolvimento frontend

Recommended Posts

ricardotiso    0

ricardotiso
Postado

Ola Pessoal.

 

Bom eu gostaria de fazer um menu parecido com o link que segue abaixo:

 

http://www.webtutoriais.com.br/open.php?cut=2216

 

A diferencça é que esse menu esta em vertical gostaria de saber como eu faço para ele ficar horizontal.

Mais ou menos assim:

 

Menu ---> Home | about | Services | Contact us

Sub Menus M1 M1 M1

M2 M2 M2

Sub do Sub Menu M3 |M1 M3|M1 M3|M1

|M2 |M2 |M2

|M3 |M3 |M3

 

 

Preciso fazer um menu com subs menus dessa forma.

 

Quel puder me ajudar desde ja agradeço.

Compartilhar este post

Link para o post
Compartilhar em outros sites

ricardotiso    0

ricardotiso
Postado

Cara me desculpe coloquei o link errado.

 

da uma olhada nesse.

 

http://www.webtutoriais.com.br/open.php?cut=2216

 

Caso não entrar corrertamente no menu a esquerda tem um menu chamado Menu II ai você clica em menu drop down - Parte 2 ai l ano final tem o link para você clicar para visualizar o menu.

 

Tem um outro link

 

http://www.marleneenxovais.com.br/design/index_loja.asp

 

Gostaria de fazer iqual esse link da uma olhada.

 

abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

cara, tem varios exemplos pelo fórum... c fez alguma busca? eh soh ir adaptando de acordo com as regras... eu postei um topico recenter um menu horizontal... mas com submenus dentro dos sub-menus, ae você vê no site do maujor ae e implementa... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

ricardotiso    0

ricardotiso
Postado

Esse é o problema cara.Cosegui fazer os menus com subs.Só que eu preciso colocar um sub menus dentro de um sub.Para ele ficar assim:Menu 1 | Menu 2 | Menu 3 | Menu 4 |___________________________SubMenu 1_______________________________>>____Sub do Submenu 1É só isso que eu não consegui.Se alguem puder me dar só um toque de como fazer isso seria legal,Ja procurei no busca e não encontrei. só encontrei demonstrando até o submenu 1 indo um nivel abaixo não achei.Se você puder me mostrar o link eu agradeceria cara.ValeuAbraços.

Compartilhar este post

Link para o post
Compartilhar em outros sites

ricardotiso    0

ricardotiso
Postado

Bom pessoal aqui vou mostrar o que eu estou precisando fazer.

 

Bom galera estou usando o seguinte código para fazer o que esta no link 1.

 

 

 

Link 1

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"><!-- saved from url=(0060)http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html --><HTML lang=pt-br xml:lang="pt-br" xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Horizontal Drop Down Menus - Parte 3</TITLE><META content="tutorial,acessibilidade,css,css menu,estilo,folhas estilo,layout css,layout sites,menu css,paginas web,tutorial css,web design,web standards,webdesign,tableless" name=keywords><META content=" Tutoriais, macetes, dicas sobre uso das CSS para projetar sites." name=description><META content="Nick Rigby" name=author><META content=true name=MSSmartTagsPreventParsing><META http-equiv=imagetoolbar content=no><META http-equiv=Pragma content=no-cache><META content=all name=robots><META content=pt-br name=language><META content=-22.975781,-43.193082 name=ICBM><META content="CSS para Web Design" name=DC.title><META http-equiv=Content-Type content="text/html; charset=iso-8859-1"><script type=text/javascript>function IEHoverPseudo() {var navItems = document.getElementById("primary-nav").getElementsByTagName("li");for (var i=0; i<navItems.length; i++) {if(navItems[i].className == "menuparent") {navItems[i].onmouseover=function() { this.className += " over"; }navItems[i].onmouseout=function() { this.className = "menuparent"; }}}}window.onload = IEHoverPseudo;</SCRIPT><STYLE type=text/css>BODY {FONT: 62.5% verdana}UL#primary-nav {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 100%; BACKGROUND: #fff; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 150px; PADDING-TOP: 0px; BORDER-BOTTOM: #ccc 1px solid}UL#primary-nav UL {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 100%; BACKGROUND: #fff; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 150px; PADDING-TOP: 0px; BORDER-BOTTOM: #ccc 1px solid}UL#primary-nav LI {LIST-STYLE-TYPE: none; POSITION: relative}UL#primary-nav LI A {BORDER-RIGHT: #ccc 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ccc 1px solid; DISPLAY: block; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: #ccc 1px solid; COLOR: #777; PADDING-TOP: 5px; BORDER-BOTTOM: #ccc 0px solid; TEXT-DECORATION: none}HTML UL#primary-nav LI {FLOAT: left; HEIGHT: 1%}HTML UL#primary-nav LI A {HEIGHT: 1%}UL#primary-nav UL {DISPLAY: none; LEFT: 149px; POSITION: absolute; TOP: 0px}UL#primary-nav LI UL LI A {PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px}UL#primary-nav LI:hover UL UL {DISPLAY: none}UL#primary-nav LI:hover UL UL UL {DISPLAY: none}UL#primary-nav LI.over UL UL {DISPLAY: none}UL#primary-nav LI.over UL UL UL {DISPLAY: none}UL#primary-nav LI:hover UL {DISPLAY: block}UL#primary-nav LI LI:hover UL {DISPLAY: block}UL#primary-nav LI LI LI:hover UL {DISPLAY: block}UL#primary-nav LI.over UL {DISPLAY: block}UL#primary-nav LI LI.over UL {DISPLAY: block}UL#primary-nav LI LI LI.over UL {DISPLAY: block}UL#primary-nav LI.menuparent {BACKGROUND: url(arrow.gif) no-repeat right center}UL#primary-nav LI.menuparent:hover {BACKGROUND-COLOR: #f9f9f9}UL#primary-nav LI.over {BACKGROUND-COLOR: #f9f9f9}UL#primary-nav LI A:hover {COLOR: #e2144a}</STYLE><META content="MSHTML 6.00.2900.2769" name=GENERATOR></HEAD><BODY><UL id=primary-nav><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Home</A> </LI><LI class=menuparent><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">About</A> <UL id=primary-nav><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">History</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Team</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Offices</A> </LI></UL></LI><LI class=menuparent><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Services</A> <UL><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Web Design</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Internet Marketing</A> </LI><LI class=menuparent><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Hosting</A> <UL><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Dedicated</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Virtual</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Shared</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Managed</A> </LI></UL></LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Domain Names</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Broadband</A> </LI></UL></LI><LI class=menuparent><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Contact Us</A> <UL><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">United Kingdom</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">France</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">USA</A> </LI><LI><A href="http://www.maujor.com/tutorial/ddownmenu/horizontal-pt3.html#">Australia</A> </LI></UL></LI></UL></BODY></HTML>

 

Como eu posso fazer para os menus ficarem como segue a figura no link2 ?

 

Link 2

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito