O uso da div

Usando div sensatamente!

Publicado em: 16 de abril de 2008  |  Leituras: 9.529  |  Canal: CSS  |  Autor: Luciano Larrossa
Ola assim como havia prometido, falaria sobre o uso da div e de uma doença que alguns desenvolvedores sofrem quando aprendem Tableless chamada "DIVTITI"!!!

Com a chegada do tableless uma revolução aconteceu em nosso código, ele ficou mais limpo mais otimozado do que quando usavamos umas certas tabelas!

Mais como falei existem outras Tags que devem ser usadas para auxiliar as divs como por exemplo a tag <ul> <li>!!!

Essas são muito úteis na hora de desenvolver um menu, é semânticamente correto inserir menu dentro de listas veja um exemplo prático de um menu com lista:

<ul id="main_nav">
    <li><a href="#">Home</a></li>
    <li><a href="#">Quem somos</a></li>
    <li><a href="#"Parceiros</a></li>
    <li><a href="#">Contato</a></li>
</ul>


Outra tag muito útil mais pouco usada é a tag label que muitos desenvolvedores desconhecem, essa tag é muito útil para montagem de  formularios semanticos, ajudam a organizar nossos formulários em blocos ficando assim muito mais fácil de entender e de fazer ajustes!
um exemplo:

<form  action="#" method="post">
             <fieldset>
                       <label>Nome: <input  type="text" /></label>
                       <label>Sobrenome:  <input type="text" /></label>
                       <label>Idade:  <input type="text" /></label>
                       <span>Sexo</span>
                       <label><input  type="radio" />masculino</label>
                       <label><input  type="radio" />feminino</label>
                       <span>Data de Nasc.</span>
                       <select>
                                <option>…</option>
                       </select>
                       <select>
                                <option>…</option>
                       </select>
                       <select>
                                <option>…</option>
                       </select>
                       <label>Signo:  <input type="text" /></label>
             </fieldset>
  </form>


Dai seria somente estilizar e deixa-lo com desgn que queremos!!!!
Não seesqueça nunca de feixar as tags isso pode causar erros no seu código (X)HTML.

Para encerrar essa coluna vou falar da tag span, muita gente se pergunta  div e span fazem a mesma coisa, quando uso div ...quando uso span.

A diferença entre <SPAN> e <DIV> é que com esta última sim que podemos aplicar estilo a uma parte mais ampla da página, por exemplo com três parágrafos. Além do mais, a etiqueta <DIV> tem um uso adicional que é o de criar divisões nas páginas as quais poderemos aplicar uma quantidade adicional de atributos para modificar seus comportamentos.

Já o nosso <span> serve mais como uma Tag auxiliar, ela auxilia a DIV e ajuda a estilizar pequenas partes.

Bom era isso, qualquer dúvida postem ai e também acito sugestões sobre colunas!
Abraços!!!

Resposta em até 24 horas! (grátis)Dúvidas?