Iniciação ao HTML: DIVs

A tag <div>  é uma das mais famosas e úteis. Esta define uma secção ou divisão num documento HTML. Porque é que isto é tão bom, porque a tag em si não altera nada no documento, mas, em conjunto com CSS, possibilita que certos pedaços do mesmo sofram certas estilizações. Dando não só muita liberdade, como também muitas possibilidades.

Como viram, nada aconteceu ao texto quando colocado dentro da tag div.

A tag deu-nos a possibilidade de utilizar o CSS para editar o texto. Desta maneira, colocando-o a bold e aumentando o tamanho.

Imagens produzidas pelo autor.

Tags div e span

As tags  <div> e <span>  são muito importantes no desenvolvimento de websites, uma vez que permitem identificar e demarcar de elementos do documento HTML. Neste sentido, são utilizadas para agrupar e definir um certo conteúdo do documento - tanto um bloco da página quanto um pedaço de texto - permitindo, posteriormente, formatar esse conteúdo específico numa stylesheet, com CSS.

Span é um elemento inline, de modo que é geralmente utilizado para demarcar pequenos blocos de HTML. 

Por outro lado, div é um elemento de bloco - o que  é equivalente a ter uma quebra de linha antes e depois do elemento-, sendo utilizado para agrupar blocos maiores de código (geralmente divisões da página, como menu, cabeçalho....).

Div e Span, duas ferramentas de HTML bastante importantes

 Ao programarmos em HTML devemos ter sempre em consideração a seleção de elementos do nosso código para facilitar o tratamento estético do nosso Website. Nesta vertente temos duas grandes ferramentas de seleção: a tag <div> e a tag <span>.

 Div, acrónimo para division (divisão em inglês), é uma ferramenta que permite o armazenamento de elementos, criando um "bloco contentor". A principal vantagem do uso de divisões ao longo do nosso código é a flexibilidade que traz no que toca à adição de estilo aos elementos que se integram na nossa divisão, isto é, se atribuirmos um atributo de identificação em HTML à nossa divisão da seguinte forma: <div id="estilo"> Conteúdo </div>, em CSS todas as alterações que dermos a esse atributo serão também aplicadas a todo o conteúdo da divisão.

 Já o Span tem a função de selecionar apenas partes de texto para que possam ser posteriormente estilizadas em CSS (com o mesmo método acima apresentado) ou então no próprio HTML através do seguinte código: <span style= "estilo que desejamos aplicar"> Texto </span>. Desta forma,

conseguirmos aplicar ao texto selecionado pela tag <span> qualquer estilo que desejemos (cor, cor de fundo, tamanho, enchimento...).

  

 Para mais informações seguem aqui dois links da W3Schools que explicam em detalhe ambos os conceitos: http://www.w3schools.com/TAgs/tag_div.asp

                 http://www.w3schools.com/TAgs/tag_span.asp

fontes:  http://www.w3schools.com/TAgs/tag_div.asp

           http://www.w3schools.com/TAgs/tag_span.asp

          https://www.sololearn.com/Course/HTML/
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span