Discussoes de Programacao e Tecnologia

Submenu

0 respostas
belcris
belcris

Boa Noite,
estou tendo problemas com uma pagina html.

criei um submenu de 3 niveis em html, para ver se funcionava… funcionou! :stuck_out_tongue:

to fazendo uma pagina de cadastro de curriculo e queria utilizar esse menu na pagina, mas quando pego o codigo do submenu e coloco na pagina sai tudo ao contrario.
vou postar os 2 codigos.
caso alguem possa me ajudar agradeco muito.

submenu.html

<html>
<head>
<title>Teste menus horizontal e vertical</title>
<style type="text/css">
.menu-vv { position: relative; margin: 0; padding: 0; display: block; zoom: 1;}
 .menu-vv * { margin: 0; padding: 0 ; list-style: none}
 .menu-vv li { position: relative; line-height: 1.2em; vertical-align: top }
 .menu-vv a { display: block; zoom: 1; line-height: 1.2em }
 .menu-vv li ul { position: absolute; visibility: hidden  }
 .menu-vv li:hover ul,
 .menu-vv li.hover ul { visibility: visible }
 .menu-vv li:hover ul ul,
 .menu-vv li.hover ul ul { visibility: hidden }
 .menu-vv li li:hover ul,
 .menu-vv li li.hover ul { visibility: visible }
 .menu-vv li li:hover ul ul,
 .menu-vv li li.hover ul ul { visibility: hidden }
 .menu-vv li li li:hover ul,
 .menu-vv li li li.hover ul { visibility: visible }

.menu-vv { float: left; }	
.menu-vv li ul { left: 100%; top: 0; }

.menu-vv li { width: 100px; background-color: white }
.menu-vv li a:hover { background-color: cyan }

 { color: expression( (function(who){ if(!who.MXPC){
	who.MXPC = '1';
	if(who.nodeName != 'A who.onmouseenterfunction(){ who.className + hover'};
		who.onmouseleave=function(){ who.className = who.className.replace( hover,}; }
	(who==who.parentNode.firstChild) ? who.className += ' first-child' : '' ;
} } )(this) , 'auto') }

</style>
</head>
<body>
<div class='menu-vv' style="width: 100; height: 19">
	<ul>
	<li><a href="./">JAVA</a>
	<ul>
	<li><a href="./">JAVA SE</a>
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="java" value="java_se_scja">SCJA</li>
	<li><input type="checkbox" name="java" value="java_se_scjpd">SGJPD</li>
    <li><input type="checkbox" name="java" value="java_se_sjdc">SJDC</li>
	</ul>
	</li>
	<li>&nbsp;</li>
	<li><a href="./">JAVA EE</a>
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="java" value="java_ee_scwcd" name="java">SCWCD</li>
	<li><input type="checkbox" name="java" value="java_ee_scbcd">SCBCD</li>
    <li><input type="checkbox" name="java" value="java_ee_scdjws">SCDJWS</li>
    <li><input type="checkbox" name="java" value="java_ee_scea">SCEA</li>    
	</ul>
	</li>
	<li>&nbsp;</li>
	<li><a href="./">JAVA ME</a>
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="java" value="java_me_smad">SMAD</li>
	</ul>
	</li>
	</ul>
	</li>
</ul>

	<ul>
	<li>&nbsp;</li>
	<li><a href="./">Redes</a>
	<ul>
	<li><a href="./">Microsoft</a>
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="redes" value="redes_microsoft_mcp">MCP</li>
	<li><input type="checkbox" name="redes" value="redes_microsoft_mcsa">MCSA</li>
	</ul>
	</li>
	<li>&nbsp;</li>
	<li><a href="./">CISCO</a>
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="redes" value="redes_cisco_ccna">CCNA</li>
	<li><input type="checkbox" name="redes" value="redes_cisco_ccnp_1">CCNP 1</li>
    <li><input type="checkbox" name="redes" value="redes_ccnp2">CCNP 2</li>
    <li><input type="checkbox" name="redes" value="redes_ccie">CCIE</li>    
	</ul>
	</li>
	<li>&nbsp;</li>
	<li><a href="./">Segurança</a>
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="redes" value="redes_seguranca_ccsa">CCSA</li>
	<li><input type="checkbox" name="redes" value="redes_seguranca_ccse">CCSE</li>    
	</ul>
	</li>
	</ul>
	</li>
</ul>
	
<ul>
	<li>&nbsp;</li>
	<li><a href="./">Linux</a>	
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="linux" value="linux_lpic_1">LPIC 1</li>
	<li><input type="checkbox" name="linux" value="linux_lpic_2">LPIC 2</li>
	</ul>
	</li>
</ul>

<ul>
	<li>&nbsp;</li>
	<li><a href="./">Windows</a>	
	<ul  style='background-color: blue'>
    <li><input type="checkbox" name="windows" value="windows_mcts">MCTS</li>
	<li><input type="checkbox" name="windows" value="windows_mcitp_ea">MCITP-EA</li>
	<li><input type="checkbox" name="windows" value="windows_mcitp_sa">MCITP-SA</li>
	<li><input type="checkbox" name="windows" value="windows_mcsa">MCSA</li>
	<li><input type="checkbox" name="windows" value="windows_mcse">MCSE</li>
	<li><input type="checkbox" name="windows" value="windows_mcp">MCP</li>
	</ul>
	</li>
</ul>

<ul>
	<li>&nbsp;</li>
	<li><a href="./">Outras</a>	
	<ul  style='background-color: blue'>
    <li><font face="Verdana" size="2" color="#003366">
    <input type="text" name="certificado" size="15" maxlenght="20"></font></li>	</ul>
	</li>
</ul>
</div>
</body>
</html>

curriculo.html

<html>
<head>
<title>Integração Universidade / Empresa - Cadastro de Acadêmicos</title>

<style type="text/css">
.menu-vv { position: relative; margin: 0; padding: 0; display: block; zoom: 1;}
 .menu-vv * { margin: 0; padding: 0 ; list-style: none}
 .menu-vv li { position: relative; line-height: 1.2em; vertical-align: top }
 .menu-vv a { display: block; zoom: 1; line-height: 1.2em }
 .menu-vv li ul { position: absolute; visibility: hidden  }
 .menu-vv li:hover ul,
 .menu-vv li.hover ul { visibility: visible }
 .menu-vv li:hover ul ul,
 .menu-vv li.hover ul ul { visibility: hidden }
 .menu-vv li li:hover ul,
 .menu-vv li li.hover ul { visibility: visible }
 .menu-vv li li:hover ul ul,
 .menu-vv li li.hover ul ul { visibility: hidden }
 .menu-vv li li li:hover ul,
 .menu-vv li li li.hover ul { visibility: visible }

.menu-vv { float: left; }	
.menu-vv li ul { left: 100%; top: 0; }

.menu-vv li { width: 100px; background-color: white }
.menu-vv li a:hover { background-color: cyan }

	
 { color: expression( (function(who){ if(!who.MXPC){
	who.MXPC = '1';
	if(who.nodeName != 'A who.onmouseenterfunction(){ who.className + hover'};
		who.onmouseleave=function(){ who.className = who.className.replace( hover,}; }
	(who==who.parentNode.firstChild) ? who.className += ' first-child' : '' ;
} } )(this) , 'auto') }

</style>
</head>

<body bgcolor="#CBD7DC" vlink="#FFFFFF" link="#FFFFFF" alink="#FFFFFF">
<div align="center">
  
  <table width="755" cellpadding="0" cellspacing="0">
     <tr>
        
      <td> <img src="../imagens/banner.jpg" width="755" height="97"></td>
     </tr>  
  </table>

<table width="755" bgcolor="#FFFFFF" bordercolor="#111111" cellpadding="0" cellspacing="0" height="1">

<tr>
      <td align="left" style="text-indent: 0; margin-left: 0" height="1"> 
      <p align="center"><a href="login_universitario.html">
      <img src="../imagens/btuniversitarios.jpg" width="161" height="124"></a></td>
      <td align="left" style="text-indent: 0; margin-left: 0" height="1"> 
      <p align="center">
      <a href="login_empresa.html">
      <img src="../imagens/btempresas.jpg" width="161" height="124"></a> 
      </td>
      <td align="left" style="text-indent: 0; margin-left: 0" height="1"> 
      <p align="center"><a href="login_instituicao.html">
      <img src="../imagens/btinstituicoes.jpg" width="161" height="124"></a></td>
      <td align="left" style="text-indent: 0; margin-left: 0" height="1"> 
      <img src="../imagens/btcontato.jpg" width="161" height="124" align="right"></td>
</tr>

<tr>
      <td height="17" width="3544" colspan="4">
      &nbsp;</td> 
</tr>

<tr>
      <td height="17" width="3544" colspan="4">
      <img src="../imagens/azul.jpg" width="755" height="17"></td> 
</tr>
</table>


<table width="755" bgcolor="#FFFFFF" bordercolor="#111111" cellpadding="0" cellspacing="0" height="130" style="border-collapse: collapse">
  
 <TR>
      <TD width="1" height="122">
<table width="755" bgcolor="#FFFFFF" bordercolor="#111111" cellpadding="0" cellspacing="0" height="130" style="border-collapse: collapse">
  
 <TR>
      <TD width="1" height="122">
      
      <a href="principal.html">
      <img src="../imagens/home_link.jpg" width="190" height="39"></a><table width="193" bgcolor="#FFFFFF" bordercolor="#111111" cellpadding="0" cellspacing="0" height="194" style="border-collapse: collapse">
  
 <TR>
      <TD width="1" height="16">
      <img src="../imagens/azul.jpg" width="192" height="17"></TD>
    </TR>
  
<tr>
      <td height="1" width="1">
      <a href="link.html">
      <img src="../imagens/link_link.jpg" width="190" height="39"></a></td> 
</tr>

<tr>
      <td height="41" width="1">
      <img src="../imagens/azul.jpg" width="192" height="17"><a href="parceiros.html"><img src="../imagens/parceiros_link.jpg" width="190" height="39"></a></td> 
</tr>

<tr>
      <td height="15" width="1">
      <img src="../imagens/azul.jpg" width="192" height="17"></td> 
</tr>

<tr>
      <td height="15" width="1">
      <a href="downloads.html">
      <img src="../imagens/dowloads_link.jpg" width="190" height="39"></a></td> 
</tr>

<tr>
      <td height="18" width="1">
      <img src="../imagens/azul.jpg" width="192" height="17"></td> 
</tr>

</table>
      </TD>
</TD>
      <TD width="551" height="122">
<p align="center"><b><font color="#FF0000" size="4">Aki teria que vir o 
submenu!!!!</font></b></TD>
    </TR>
  

 <TR>
      <TD width="1" height="122">
      
      &nbsp;</TD>
      <TD width="551" height="122">
            <table width="455" bgcolor="#FFFFFF" bordercolor="#111111" cellpadding="0" cellspacing="0" style="border-collapse: collapse" height="202">

<tr>
   <td align="center" width="1014" height="13">
   &nbsp;</td>
</tr>

<tr>
   <td align="center" width="1014" height="22">
   &nbsp;</td>
</tr>

<tr>
   <td align="center" width="1014" height="22">
   &nbsp;</td>
</tr>

<tr>
<td height="16" width="922">
&nbsp;</td> 
</tr>

<tr>
<td height="16" width="922">
&nbsp;</td> 
</tr>

<tr>
   <td align="right" width="919" height="22">
   &nbsp;</td>
</tr>

<tr>
<td height="16" width="922">
&nbsp;</td> 
</tr>

<tr>
   <td align="left" width="922" height="9">
      &nbsp;</td>
</tr>

<tr>
<td height="16" width="922">
&nbsp;</td> 
</tr>

<tr>
   <td align="left" width="922" height="16">
   &nbsp;</td>
</tr>

<tr>
<td height="16" width="922">
&nbsp;</td> 
</tr>

</table>

      </TD>
    </TR>
  
</table>

<table width="755" bgcolor="#FFFFFF" bordercolor="#111111" cellpadding="0" cellspacing="0">

<tr>
<td background="0A1633" height="16" width="753" bgcolor="#808080">
       <p align="center"><font color="#000033" size="2" class="verdana" >Copyright@2008 - Op&ccedil;&atilde;o de Qualidade - Todos os direitos reservados</p>
</td> 
</tr>
</table>

<table width="755" bgcolor="#FFFFFF" bordercolor="#111111" cellpadding="0" cellspacing="0">

<tr>
      <td  height="16" width="753">
      <img src="../imagens/azul.jpg" width="755" height="17"></td> 
</tr>

</table>
 
</div>
<div align="center"></div>

</body>
</html>
<html>

Desde ja agradeco a atencao! :wink:

Alura Desenvolvimento Front-End React Do primeiro componente à liderança técnica! HTML/CSS/JavaScript fundamental, React com hooks e...
Criado 16 de outubro de 2008
Respostas 0
Participantes 1

Topicos relacionados

Compilar e executar uma classe java pelo prompt do windows 13 respostas [RESOLVIDO] Como executar função JavaScript após página carregada 13 respostas Java.lang.OutOfMemoryError: Java heap space - Como resolver? 11 respostas Como consultar CPF na Receita Federal usando Web Service? 22 respostas Como acessar localhost de forma externa? [RESOLVIDO] 13 respostas
Alura VSCode: extensões mais usadas Quais as extensões que podem auxiliar na hora desenvolvimento na IDE Visual Studio Code
Casa do Codigo Seguranca em front-end: Estrategias para mitigar ataques... Por Antonio Luis Rossi — Casa do Codigo