Zaloguj | Zarejestruj | FAQ
Anonymous

Como criar um menu lateral(parecido com o do HTML.net <--)

+ Odpowiedz

Posty: 5 Strona 1 z 1


Como criar um menu lateral(parecido com o do HTML.net <--)

przez Ryugo » So lis 19, 2011 11:53 pm

Eu queria saber como criar um menu lateral parecido com esse que fica aqui do lado esquerdo da tela <--.
Eu vi o código HTML usado na página e não consegui fazer.
Eu sei que precisa conhecer CSS também para isso,por isso eu fiz as aulas:)
Avatar użytkownika

Ryugo

  • Posty: 3
  • Dołączył(a): Cz wrz 01, 2011 10:14 pm

Re: Como criar um menu lateral(parecido com o do HTML.net <-

przez atik » Wt lis 22, 2011 3:39 pm

Tente ser paciente quando aprendizado. Prática cada vez mais. Então experimente o css por si mesmo. Então qualquer problema surgir durante a codificação, deixe-nos saber.
Avatar użytkownika

atik

  • Posty: 471
  • Dołączył(a): Pn paź 17, 2011 4:55 pm

Re: Como criar um menu lateral(parecido com o do HTML.net <-

przez iperd » So lut 18, 2012 5:52 pm

Kod: Zaznacz cały
<!--Menu!-->
<html>
<head>   <title>Menu</title>
<style type="text/css" media="all">

a{text-decoration:none;color:#000099;}
a:hover{background: cyan;color:#000;} 
div {border:2px solid #000099}
#container{width:190px;float:left;height:320px;}
#subcont{margin:9px;width:180px;float:right;position:relative;top:-20px;}
.idioma{width:130px; position:relative;top:-17px;left:20px}
.layout{width:130px; position:relative;top:-47px;left:20px}
.bt1{position:relative;top:-17px;left:20px;}
.bt2{position:relative;top:-47px;left:20px;}
.titleh4{position:relative;top:-30px;}
h3,h4{border-bottom:1px solid #DDDDDD;position:relative;left:20px;width:160px;}

</style>
</head>
<body>

<div id="container">
   <h3>Fóruns</h3>
   <ul>
         <li><a href="#">Fórum HTML</a></li>
         <li><a href="#">Fórum CSS</a></li>
         <li><a href="#">Fórum PHP</a></li>
         <li><a href="#">Análise de Websites</a></li>
         <li><a href="#">Discussões gerais</a>
   </ul>

<span id="subcont">
   <h4>Idioma</h4>
      <select class="idioma">
           <option>Português{Brasil}
           <option>Argentina</option>
           <option>Espanõl</option>
           <option>Italiano</option>
           <input class="bt1" type="button" name="bt1" value=">>" onclick="">
      </select>

   <h4 class="titleh4">Layout</h4>
      <select class="layout">
          <option>Default</option>
          <option>Default Blue</option>
          <option>No CSS</option>
          <input type="button" class="bt2" value=">>" onclick="">
      </select>
</span>

</div>
</body>
</html>


Eu fiz a folha de estilo css com pressa, mas da pra resumir mais ainda o código..
Fico parecido até, coloquei um efeito a mais ao passar o mause sobre os link..

Cole tudo isso no bloco de notas, salve como qualquer coisa .html e veja como fico.
Avatar użytkownika

iperd

  • Posty: 3
  • Dołączył(a): So lut 18, 2012 7:19 am

Re: Como criar um menu lateral(parecido com o do HTML.net <-

przez Angel Bennet » Śr cze 27, 2012 2:28 am

Legal!
Avatar użytkownika

Angel Bennet

  • Posty: 1
  • Dołączył(a): Pn cze 25, 2012 2:38 am

Re: Como criar um menu lateral(parecido com o do HTML.net <-

przez Bruno Bezerra » Cz cze 12, 2014 8:19 pm

Bacana, belo menu! Torna-se mais dinâmico pelo fato de ser lateral, com todas as categorias do fórum.
Avatar użytkownika

Bruno Bezerra

  • Posty: 16
  • Dołączył(a): Śr mar 26, 2014 8:31 pm
  • Lokalizacja: Brasil.


+ Odpowiedz

Strona 1 z 1