`
linguagem` `
topico` `
nome`Conceito Tag Div`
` `
titulo`Conceito Tag Div`
` `
descritor`Conceito Tag Div `
` `
lead`Conceitos dos elementos de uma tag div. Sintaxe(regras de sequencia para escrever a div e suas proriedades com seus valores)
e semantica(definicao dos valores das propriedades de um elemento. Exemplo: modelo de caixa(box) pelo W3SChool.`
` `
melhorar`Melhorar`
` `
referencia`modelo de caixa(box) pelo W3C,
`
` `
referencia`Para testar codigo`
` `
origem`ConceitoTagDiv.xml`
` `
` `
topico` `
titulo`Exemplo`
` `
desc`
Margin(margin) - Limpa uma área ao redor da borda. A margem não tem uma cor de fundo, que é completamente transparente
Fronteira (border) - A fronteira que gira em torno do preenchimento e conteúdo. A fronteira é herdado da propriedade de cor da caixa
Preenchimento (padding) - Limpa uma área em torno do conteúdo. O preenchimento é afetada pela cor de fundo da caixa
Conteúdo - O conteúdo da caixa, em que o texto e as imagens aparecem.
height- Defini a altura de um elemento.
width - Defini a largura de um elemento.
Para calcular o tamanho total de um elemento, você também deve adicionar o preenchimento, bordas e margens.
`
` `
` `
topico` `
titulo`Exemplo Detalhado`
` `
desc`
Este diagrama ilustra as quatro áreas de caixa CSS genérico: conteúdo, espaçamento(padding), borda (border) e margem (margin).
Há quatro caixas aninhadas: a área de conteúdo é o mais profundo, em seguida, espaçamento, borda, e as áreas de margem.
Cada área tem um estilo de borda diferente para distinguir seus cantos(edge): a borda conteúdo é fina (thin) e sólida (solid);
espaçamento(padding) é fina e tracejada(dashed); borda(padding) é grossa(thick) e sólida; margem é grossa e tracejada.
Abaixo as caixas, uma legenda relaciona os estilos de borda utilizados para os quatro cantos.
A imagem acima é 250px de largura (wide). A largura(width) total deste elemento é também 250px.
width: 250px; padding: 10px; border: 5px solid gray; margin: 0px;>
`
` `
` `
topico` `
titulo`Outros conceitos relacionados`
` `
desc`
  • Elemento, tag, atributos- Ex.: texto, imagem, video, som, tag Ex.: div atributo=valor
  • Atributo ou Propriedade - Ex.: margin-right:
  • Valor - 'Ex.: " length | percentage | auto "
`
` `
` `
topico` `
titulo`Referencias`
` `
desc` `
` `
` `
`