Ir para conteúdo

POWERED BY:

Arquivado

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

marcelo aquino

como foi criado menu do site imasters

Recommended Posts

caros amigos do forum, gostaria de saber como foi criado o menu do site da imasters pois gostei muito e gostaria de fazer no site que estou construindo, alguem pode me ajudar, sou novo no ramo. muito obrigado.

Compartilhar este post


Link para o post
Compartilhar em outros sites

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><META http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><STYLE> /* Rule 35 of http://static.imasters.com.br/estilo/padrao.css */ #geral {	BORDER-RIGHT: #fff 5px solid;	BORDER-TOP: #fff 5px solid;	MARGIN: 6px 0px 6px 6px;	BORDER-LEFT: #fff 5px solid;	WIDTH: 760px;	BORDER-BOTTOM: #fff 5px solid;	BACKGROUND-COLOR: #fff} /* Rule 4 of http://static.imasters.com.br/estilo/index.css */ #geral {	BACKGROUND: url(http://static.imasters.com.br/img/capa/f_menu_6.gif) #fff repeat-y 0px 5px} /* Rule 1 of http://static.imasters.com.br/estilo/padrao.css */ BODY {	PADDING-RIGHT: 0px;	PADDING-LEFT: 0px;	PADDING-BOTTOM: 0px;	MARGIN: 0px;	PADDING-TOP: 0px} /* Rule 12 of http://static.imasters.com.br/estilo/padrao.css */ BODY {	FONT-WEIGHT: normal;	FONT-SIZE: 11px;	PADDING-BOTTOM: 5px;	FONT-FAMILY: Arial, Helvetica, sans-serif;	BACKGROUND-COLOR: #d2cfcf} /* Rule 13 of http://static.imasters.com.br/estilo/padrao.css */ HTML > BODY {	PADDING-BOTTOM: 0px} /* Rule 8 of http://static.imasters.com.br/estilo/padrao.css */ UL {	PADDING-RIGHT: 0px;	PADDING-LEFT: 0px;	PADDING-BOTTOM: 0px;	MARGIN: 0px;	PADDING-TOP: 0px} /* Rule 1 of http://static.imasters.com.br/estilo/menu.css */ UL#menu {	BORDER-RIGHT: #fff 1px solid;	BORDER-TOP: #fff 1px solid;	MARGIN-TOP: -16px;	FLOAT: left;	WIDTH: 152px;	MARGIN-RIGHT: 10px;	LIST-STYLE-TYPE: none} /* Rule 2 of http://static.imasters.com.br/estilo/menu.css */ UL#menu LI {	FONT-WEIGHT: bold;	BACKGROUND: url(http://static.imasters.com.br/img/capa/f_menu_1.gif) #028192;	FLOAT: left;	WIDTH: 152px;	COLOR: #fff;	LINE-HEIGHT: 26px} /* Rule 4 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL {	LIST-STYLE-TYPE: none} /* Rule 6 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL LI {	BORDER-RIGHT: #313131 1px solid;	BORDER-TOP: #fff 1px solid;	BACKGROUND: #ededed;	FLOAT: left;	FONT: 11px/26px Arial, Helvetica, sans-serif;	WIDTH: 151px;	BORDER-BOTTOM: #d1d1d1 1px solid;	HEIGHT: 26px} /* Rule 15 of http://static.imasters.com.br/estilo/menu.css */ UL#menu LI.dial {	BORDER-TOP-WIDTH: 0px;	BORDER-RIGHT: #000 1px solid;	BORDER-LEFT-WIDTH: 0px;	BACKGROUND-IMAGE: none;	BORDER-BOTTOM-WIDTH: 0px;	PADDING-TOP: 10px;	HEIGHT: 90px;	TEXT-ALIGN: center} /* Rule 14 of http://static.imasters.com.br/estilo/padrao.css */ A {	COLOR: #000;	TEXT-DECORATION: none} /* Rule 5 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL LI A {	DISPLAY: block;	PADDING-LEFT: 10px;	FONT-SIZE: 11px;	COLOR: #333} /* Rule 3 of http://static.imasters.com.br/estilo/menu.css */ UL#menu LI SPAN {	PADDING-LEFT: 17px;	BACKGROUND: url(http://static.imasters.com.br/img/capa/f_menu_3.gif) no-repeat left 50%;	FONT: bold 11px/26px Arial, Helvetica, sans-serif} /* Rule 7 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL#canais LI {	BACKGROUND: url(http://static.imasters.com.br/img/capa/f_menu_4.gif) #ededed no-repeat left top} /* Rule 11 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL#canais LI DIV {	BORDER-RIGHT: #999 1px solid;	BORDER-TOP: #999 1px solid;	MARGIN-TOP: -28px;	DISPLAY: none;	LEFT: 162px;	FLOAT: left;	BORDER-LEFT: #999 1px solid;	WIDTH: 152px;	BORDER-BOTTOM: #999 1px solid;	POSITION: absolute} /* Rule 12 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL#canais LI DIV UL LI {	BORDER-TOP: #fff 1px solid;	BACKGROUND: #f8f8f8;	BORDER-LEFT: #dcecf0 8px solid;	WIDTH: 144px;	BORDER-BOTTOM: #d1d1d1 1px solid;	BORDER-RIGHT-WIDTH: 0px} /* Rule 8 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL#canais LI A {	DISPLAY: block;	PADDING-LEFT: 10px;	BACKGROUND: url(http://static.imasters.com.br/img/capa/menu_seta.gif) no-repeat 136px 50%;	WIDTH: 141px} /* Rule 14 of http://static.imasters.com.br/estilo/menu.css */ UL#menu UL#canais LI DIV UL LI A {	BACKGROUND: none transparent scroll repeat 0% 0%} </STYLE></HEAD><BODY style="BEHAVIOR: url(#default#clientCaps)"><DIV id="geral"> <UL id="menu"><LI><SPAN>Canais iMasters</SPAN> <UL id="canais"><LI class=""><A href="http://www.imasters.com.br/canal/bancodedados">Banco de Dados</A> <DIV><UL><LI class=""><A href="http://www.imasters.com.br/secao/access">Access</A> </LI><LI class=""><A href="http://www.imasters.com.br/secao/db2">DB2</A> </LI><LI class=""><A href="http://www.imasters.com.br/secao/interbase">Interbase</A> </LI><LI class=""><A href="http://www.imasters.com.br/secao/mysql">MySQL</A> </LI><LI><A href="http://www.imasters.com.br/secao/oracle">Oracle</A> </LI><LI><A href="http://www.imasters.com.br/secao/postgresql">PostgreSQL</A> </LI><LI><A href="http://www.imasters.com.br/secao/sql_server">SQL Server</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/comunicacao">Comunicação</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/elearning">E-Learning</A> </LI><LI><A href="http://www.imasters.com.br/secao/publicidade">Publicidade Online</A> </LI><LI><A href="http://www.imasters.com.br/secao/voip">VoIP</A> </LI><LI><A href="http://www.imasters.com.br/secao/webwriting">Web Writing</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/criacao">Criação</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/3dsmax">3ds max</A> </LI><LI><A href="http://www.imasters.com.br/secao/fireworks">Fireworks</A> </LI><LI><A href="http://www.imasters.com.br/secao/flash">Flash</A> </LI><LI><A href="http://www.imasters.com.br/secao/lightwave3d">Lightwave 3D</A> </LI><LI><A href="http://www.imasters.com.br/secao/photoshop">Photoshop</A> </LI><LI><A href="http://www.imasters.com.br/secao/suite_corel">Suite Corel</A> </LI><LI><A href="http://www.imasters.com.br/secao/teoria">Teoria/Design</A> </LI><LI><A href="http://www.imasters.com.br/secao/usabilidade">Usabilidade</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/desenvolvimento">Desenvolvimento</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/des_de_software">Des. de Software</A> </LI><LI><A href="http://www.imasters.com.br/secao/dreamweaver">Dreamweaver</A> </LI><LI><A href="http://www.imasters.com.br/secao/flex">Flex</A> </LI><LI><A href="http://www.imasters.com.br/secao/jdeveloper">JDeveloper</A> </LI><LI><A href="http://www.imasters.com.br/canal/dotnet">Plataforma .Net</A> </LI><LI><A href="http://www.imasters.com.br/secao/visual_foxpro">V. FoxPro</A> </LI><LI><A href="http://www.imasters.com.br/canal/webstandards">Web Standards</A> </LI><LI><A href="http://www.imasters.com.br/secao/zope">Zope</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/gerencia">Gerência</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/bi">Business Intelligence</A> </LI><LI><A href="http://www.imasters.com.br/secao/direito">Direito e Web</A> </LI><LI><A href="http://www.imasters.com.br/secao/egov">E-Gov</A> </LI><LI><A href="http://www.imasters.com.br/secao/governanca">Governança de TI</A> </LI><LI><A href="http://www.imasters.com.br/secao/intranets">Intranets</A> </LI><LI><A href="http://www.imasters.com.br/canal/mercado">Mercado</A> </LI><LI><A href="http://www.imasters.com.br/canal/webmarketing">Web Marketing</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/mercado">Mercado</A> <DIV><UL><LI class=""><A href="http://www.imasters.com.br/secao/carreira">Carreira</A> </LI><LI class=""><A href="http://www.imasters.com.br/secao/certificacoes">Certificações</A> </LI><LI class=""><A href="http://www.imasters.com.br/secao/ecommerce">E-commerce</A> </LI><LI class=""><A href="http://www.imasters.com.br/secao/tendencias">Tendências</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/dotnet">Plataforma .Net</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/aspnet">ASP.NET</A> </LI><LI><A href="http://www.imasters.com.br/secao/csharp">C#</A> </LI><LI><A href="http://www.imasters.com.br/secao/vbnet">VB.NET</A> </LI><LI><A href="http://www.imasters.com.br/secao/visual_studio">Visual Studio</A> </LI><LI><A href="http://www.imasters.com.br/secao/xml">XML</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/programacao">Programação</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/actionscript">ActionScript</A> </LI><LI><A href="http://www.imasters.com.br/secao/asp">ASP</A> </LI><LI><A href="http://www.imasters.com.br/secao/coldfusion">ColdFusion</A> </LI><LI><A href="http://www.imasters.com.br/secao/delphi">Delphi</A> </LI><LI><A href="http://www.imasters.com.br/secao/java">Java</A> </LI><LI><A href="http://www.imasters.com.br/secao/javascript">Javascript</A> </LI><LI><A href="http://www.imasters.com.br/secao/php">PHP</A> </LI><LI><A href="http://www.imasters.com.br/secao/ruby">Ruby on Rails</A> </LI><LI><A href="http://www.imasters.com.br/secao/uml">UML</A> </LI><LI><A href="http://www.imasters.com.br/secao/visual_basic">Visual Basic</A> </LI><LI><A href="http://www.imasters.com.br/secao/xml">XML</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/redes">Redes</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/cisco">Cisco</A> </LI><LI><A href="http://www.imasters.com.br/secao/linux">Linux</A> </LI><LI><A href="http://www.imasters.com.br/secao/servidores_windows">Servidores Windows</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/seguranca">Segurança</A> <DIV><UL><LI class=""><A href="http://www.imasters.com.br/secao/direito">Direito e Web</A> </LI><LI class=""><A href="http://www.imasters.com.br/secao/virus">Vírus</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/livre">Software Livre</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/linux">Linux</A> </LI><LI><A href="http://www.imasters.com.br/secao/mysql">MySQL</A> </LI><LI><A href="http://www.imasters.com.br/secao/postgresql">PostgreSQL</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/tecnologia">Tecnologia</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/acessibilidade">Acessibilidade</A> </LI><LI><A href="http://www.imasters.com.br/secao/des_de_software">Des. de Software</A> </LI><LI><A href="http://www.imasters.com.br/secao/mobile">Mobile</A> </LI><LI><A href="http://www.imasters.com.br/secao/tendencias">Tendências</A> </LI><LI><A href="http://www.imasters.com.br/secao/voip">VoIP</A> </LI><LI><A href="http://www.imasters.com.br/secao/webservices">WebServices</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/webmarketing">Web Marketing</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/email_marketing">E-mail Marketing</A> </LI><LI><A href="http://www.imasters.com.br/secao/publicidade">Publicidade Online</A> </LI><LI><A href="http://www.imasters.com.br/secao/seo">SEO</A> </LI></UL></DIV></LI><LI class=""><A href="http://www.imasters.com.br/canal/webstandards">Web Standards</A> <DIV><UL><LI><A href="http://www.imasters.com.br/secao/acessibilidade">Acessibilidade</A> </LI><LI><A href="http://www.imasters.com.br/secao/ajax">Ajax</A> </LI><LI><A href="http://www.imasters.com.br/secao/css">CSS</A> </LI><LI><A href="http://www.imasters.com.br/secao/javascript">Javascript</A> </LI><LI><A href="http://www.imasters.com.br/secao/tableless">Tableless</A> </LI><LI><A href="http://www.imasters.com.br/secao/usabilidade">Usabilidade</A> </LI><LI><A href="http://www.imasters.com.br/secao/xhtml">XHTML</A> </LI><LI><A href="http://www.imasters.com.br/secao/xml">XML</A> </LI></UL></DIV></LI></UL></LI><LI><SPAN>Serviços iMasters</SPAN> <UL><LI><A href="http://www.imasters.com.br/evento">Agenda de Eventos</A> </LI><LI><A href="http://www.codigolivre.com.br/">Códigos Livres</A> </LI><LI><A href="http://www.imasters.com.br/cssinterativo">CSS Interativo</A> </LI><LI><A href="http://www.iped.com.br/cursos/imasters">Cursos Online</A> </LI><LI><A href="http://www.imasters.com.br/dicas">Dicas iMasters</A> </LI><LI><A href="http://www.webdocs.com.br/">Documentações</A> </LI><LI><A href="http://www.imasters.com.br/download">Downloads</A> </LI><LI><A href="http://www.imasters.com.br/entrevistas">Entrevistas</A> </LI><LI><A href="http://www.imasters.com.br/faq">FAQ</A> </LI><LI><A href="http://forum.imasters.com.br/">Fórum iMasters</A> </LI><LI><A href="http://www.imasters.com.br/grupos">Guia de Users Groups</A> </LI><LI><A href="http://www.imasters.com.br/intercon/">iMasters InterCon</A> </LI><LI><A href="http://mercado.imasters.com.br/">Mercado iMasters</A> </LI><LI><A href="http://www.imasters.com.br/contrato">Modelos de Contrato</A> </LI><LI><A href="http://www.imasters.com.br/tabela_de_cores">Tabela de Cores Web</A> </LI><LI><A href="http://www.tishop.com.br/">TI SHOP</A> </LI></UL></LI><LI><SPAN>Interação</SPAN> <UL><LI><A href="http://www.imasters.com.br/anuncie">Anuncie no iMasters</A> </LI><LI><A href="http://www.imasters.com.br/cadastro">Cadastre-se no iMasters</A> </LI><LI><A href="http://www.imasters.com.br/faleconosco">Fale Conosco</A> </LI><LI><A href="http://www.imasters.com.br/sobre">Sobre o iMasters</A> </LI><LI class="dial"></LI></UL></LI></UL> </DIV></BODY></HTML>

Listas <ul>, com formatação CSS... procure o fórum do assunto, que concerteza aprenderá bastante coisa legal e interessante sobre o assunto.

 

Webstandards: CSS / XML / XHTML/ HTML

Compartilhar este post


Link para o post
Compartilhar em outros sites

amigo, peguei todo este codigo q você colocou no dreamweaver e nao aconteceu nada, tem q salvar de algum jeito diferente?rsdesculpe, mais faz mto tempo q nao mexo com sites e agora q voltei a trab. nesse setor to encontrando dificuldade

Compartilhar este post


Link para o post
Compartilhar em outros sites

Nossa um topico ressucitado.Mas respondendo a dúvida...É pegando esse codigo e colocando você não vai conseguir nada, por que isso é um pedaço do codigo. Você precisar fora isso ter uma lista para ser interpretado como menu num arquivo externo e o codigo de css, que também é um outro arquivo. Sugiro você dar uma olhada na sessão de Web Standarts, CSS e outros atrás de informações de como criar menus desse tipo!;D

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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