Muitas pessoas que são novas em web design e HTML / CSS usam o e O elemento div define divisões lógicas na sua página da web. É basicamente uma caixa na qual você pode colocar outros elementos HTML que combinam logicamente. Uma divisão pode ter vários outros elementos nela, como parágrafos, cabeçalhos, listas, links, imagens, etc. Ela pode até ter outras divisões dentro dela para fornecer estrutura e organização adicionais ao seu documento HTML. Para usar o elemento div, coloque uma id = "myDiv">
), ou um seletor de classe (por exemplo, class = "bigDiv"> O elemento div é diferente do elemento de seção HTML5 porque não fornece ao conteúdo incluído nenhum significado semântico. Se você não tiver certeza se o bloco de conteúdo deve ser div ou seção, pense em qual é a finalidade do elemento e do conteúdo para ajudá-lo a decidir qual usar: Por fim, as divs e as seções se comportam de maneira bastante semelhante e você pode atribuir valores de atributos a cada um deles e estilizá-las com CSS para obter a aparência do site de que você precisa. Ambos são elementos de nível de bloco. O elemento span é um elemento in-line por padrão. Isso o diferencia dos elementos div e section. O elemento span geralmente é usado para envolver uma parte específica do conteúdo, normalmente texto, para fornecer um "gancho" adicional que pode ser estilizado posteriormente. Usado com CSS, ele pode alterar o estilo do texto que ele contém; no entanto, sem nenhum atributo de estilo, o elemento span só não tem efeito sobre o texto. Essa é a principal diferença entre o span e os elementos div. Como mencionado acima, o elemento div inclui uma quebra de parágrafo, ao passo que o elemento de extensão somente instrui o navegador a aplicar regras de estilo CSS associadas ao que é incluído pelo Tag: Texto destacado e texto não realçado. Adicione o class = "highlight"
ou outra classe para o elemento span para estilizar o texto com CSS (por exemplo, class = "highlight">
) .O elemento span não possui atributos obrigatórios, mas os três que são mais úteis são os mesmos que os do elemento div: Use o intervalo quando você quiser alterar o estilo do conteúdo sem definir esse conteúdo como um novo elemento no nível de bloco no documento. Por exemplo, se você quiser que a segunda palavra de um cabeçalho h3 seja vermelha, você pode cercar essa palavra com um elemento de extensão que possa definir essa palavra como texto vermelho. A palavra ainda permanece como parte do elemento h3, mas agora também é exibida em vermelho: Usando o
). Esses dois atributos podem ser selecionados usando CSS ou modificados usando JavaScript. As melhores práticas atuais tendem a usar seletores de classe em vez de IDs, em parte devido à especificidade dos seletores de ID. Na verdade, no entanto, você poderia usar qualquer um deles e até mesmo dar uma divisão a um ID e a um seletor de classe. Quando usar
Usando o Elemento
Este é meu título impressionante
elementos de forma intercambiável enquanto criam páginas da web. A realidade, no entanto, é que cada um desses elementos HTML serve a propósitos diferentes. Aprender a usar cada um para o propósito pretendido o ajudará a desenvolver páginas da Web mais limpas, cujo código é mais fácil de gerenciar em geral.
Elemento
tag antes da área da sua página que você deseja como uma divisão separada, e um fechamento
tag depois:
conteúdo do div
Se a área da sua página precisar de algumas informações adicionais que você usará para estilizar com o CSS mais tarde, você poderá adicionar um seletor de ID (por exemplo,
Versus
