登录 | 注册 | FAQ
Anonymous

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

+ 发表回复

5 篇帖子 分页: 1 / 1


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

Ryugo » 周六 11月 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:)
头像

Ryugo

  • 帖子: 3
  • 注册: 周四 9月 01, 2011 10:14 pm

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

atik » 周二 11月 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.
头像

atik

  • 帖子: 471
  • 注册: 周一 10月 17, 2011 4:55 pm

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

iperd » 周六 2月 18, 2012 5:52 pm

代码: 全选
<!--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.
头像

iperd

  • 帖子: 3
  • 注册: 周六 2月 18, 2012 7:19 am

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

Angel Bennet » 周三 6月 27, 2012 2:28 am

Legal!
头像

Angel Bennet

  • 帖子: 1
  • 注册: 周一 6月 25, 2012 2:38 am

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

Bruno Bezerra » 周四 6月 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.
头像

Bruno Bezerra

  • 帖子: 16
  • 注册: 周三 3月 26, 2014 8:31 pm
  • 地址: Brasil.


+ 发表回复

分页: 1 / 1