Como trabalhar com tags vazias e de contêiner em HTML

Como Trabalhar Com Tags Vazias E De Conteiner Em Html



A linguagem de marcação de hipertexto, também conhecida como HTML, é usada para criar aplicativos da web. As tags HTML, comumente conhecidas como elementos, são o aspecto mais importante da linguagem HTML. As tags HTML incorporam e exibem conteúdo ou informações em páginas da web. Existem dois tipos de tags HTML: tags vazias e de contêiner.

Este blog orientará como trabalhar com tags vazias e de contêiner em HTML.







Tags vazias

As tags vazias também são conhecidas como “ solteiro ' ou ' vazio ' Tag. A tag void nunca contém nenhum conteúdo, mas os atributos podem ser especificados. Essas tags não possuem uma tag final e podem conter uma barra invertida na tag. Os exemplos de tags vazias são “
”, “”, “”, “ ”, “ ”, “”, “ ” e muitos mais.



Sintaxe



A sintaxe para mencionar os elementos void em HTML é a seguinte:





< tag vazia />

Para ver como trabalhar com tags vazias, confira o exemplo abaixo. O '
” é conhecida como tag de quebra de linha e é usada para quebrar a linha:



< p > Tags HTML Vazias < br > A linha pausa Marcação p >

A saída indica que o “
” quebrou a linha:

Podemos adicionar propriedades de estilo CSS às tags HTML. O '


” é outro elemento vazio que adiciona uma linha horizontal à página:

< p > Tags HTML Vazias
< hora estilo = 'borda superior: 3px vermelho tracejado;' > A linha pausa Marcação
p >

O ' borda superior ” A propriedade CSS é aplicada ao “


” com três valores, um é a largura da borda igual a “ 3px ”, o estilo da borda é definido como “ tracejadas ” e cor da borda.

Saída

Até agora, discutimos as tags HTML vazias. Agora, veremos as tags de contêiner HTML na próxima seção.

Etiquetas de contêiner

As tags de contêiner HTML consistem em três partes: tags iniciais, conteúdo e tags finais. A sintaxe da tag de contêiner HTML é fornecida da seguinte forma:

< dia de início > Contente etiqueta final >

Confira os exemplos abaixo para saber como a tag container funciona em HTML.

Exemplo 1: Como adicionar um parágrafo em HTML?

O '

” é usada para incorporar o parágrafo no documento HTML:

< p > Esta é uma tag de parágrafo p >

Saída

Exemplo 2: Como adicionar cabeçalhos em HTML?

Existem seis níveis de tags de contêiner de título que podem ser usados ​​para adicionar títulos a uma página da web. Vamos colocá-los em um documento HTML para ver como eles funcionam e aparecem em uma página da web:

< h1 > Linux h1 >
< h2 > Linux h2 >
< h3 > Linux h3 >
< h4 > Linux h4 >
< h5 > Linux h5 >
< h6 > Linux h6 >

Saída

Podemos fornecer o estilo embutido para essas tags. Considere o exemplo abaixo, que mostra como aplicar várias propriedades de estilo CSS a essas tags:

< h1 estilo = 'cor de fundo: cardo; família da fonte: cursiva;' > Linux h1 >
< h2 estilo = 'cor de fundo: trigo; alinhamento de texto: centro;' > Linux h2 >
< h3 estilo = 'cor de fundo: tomate; cor: branco;' > Linux h3 >
< h4 estilo = 'família da fonte: 'Trebuchet MS'; cor de fundo: verde-amarelo;' > Linux h4 >
< h5 estilo = 'cor de fundo: violeta;' > Linux h5 >
< h6 estilo = 'cor de fundo: whitesmoke;' > Linux h6 & gt

Aqui está a explicação das propriedades mencionadas acima:

  • O ' cor de fundo ” adiciona cor ao fundo do elemento.
  • família de fontes ” ajusta o estilo da fonte do elemento.
  • alinhamento de texto ” ajusta o posicionamento ou alinhamento do texto.

Saída

Mostramos a você como usar as tags vazias e de contêiner do HTML.

Conclusão

As tags vazias e as tags de contêiner são os principais componentes dos documentos HTML que incorporam o conteúdo e as informações em uma página da web. As tags vazias não contêm nenhum conteúdo e consistem apenas na tag inicial com uma barra invertida no final, como
. No entanto, as tags de contêiner contêm as tags inicial e final junto com o conteúdo. Este blog elaborou sobre o funcionamento de elementos vazios e contêineres em HTML.