Cómo trabajar con etiquetas vacías y de contenedor en HTML

Como Trabajar Con Etiquetas Vacias Y De Contenedor En Html



El lenguaje de marcado de hipertexto, también conocido como HTML, se utiliza para crear aplicaciones web. Las etiquetas HTML, comúnmente conocidas como elementos, son el aspecto más importante del lenguaje HTML. Las etiquetas HTML incrustan y muestran contenido o información en páginas web. Hay dos tipos de etiquetas HTML: etiquetas vacías y contenedoras.

Este blog le guiará sobre cómo trabajar con etiquetas vacías y contenedoras en HTML.







Etiquetas vacías

Las etiquetas vacías también se conocen como “ único ' o ' vacío ” etiquetas. La etiqueta void nunca contiene ningún contenido, pero se pueden especificar atributos. Estas etiquetas no tienen una etiqueta final y pueden contener una barra invertida en la etiqueta. Los ejemplos de etiquetas vacías son “
”, “”, “”, “ ”, “ ”, “”, “ ”, y muchas más.



Sintaxis



La sintaxis para mencionar los elementos vacíos en HTML es la siguiente:





< etiqueta vacía />

Para ver cómo trabajar con etiquetas vacías, consulte el siguiente ejemplo. Él '
La etiqueta ” se conoce como etiqueta de salto de línea y se utiliza para romper la línea:



< pag > Etiquetas HTML vacías < hermano > La línea descanso Etiqueta pag >

La salida indica que el “
La etiqueta ” ha roto la línea:

Podemos agregar propiedades de estilo CSS a las etiquetas HTML. Él '


La etiqueta ” es otro elemento vacío que agrega una línea horizontal a la página:

< pag > Etiquetas HTML vacías
  < hora estilo = 'borde-superior: 3px rojo discontinuo;' > La línea descanso Etiqueta
pag >

Él ' borde superior ” La propiedad CSS se aplica al “


” con tres valores, uno es el ancho del borde que es igual a “ 3 píxeles ”, el estilo de borde se establece como “ punteado ” y color del borde.

Producción

Hasta ahora, hemos discutido las etiquetas vacías de HTML. Ahora, revisaremos las etiquetas de contenedor HTML en la siguiente sección.

Etiquetas de contenedores

Las etiquetas de contenedor HTML constan de tres partes: etiquetas iniciales, contenido y etiquetas finales. La sintaxis de la etiqueta del contenedor HTML es la siguiente:

< día_de_inicio > Contenido etiqueta final >

Consulte los ejemplos a continuación para aprender cómo funciona la etiqueta del contenedor en HTML.

Ejemplo 1: ¿Cómo agregar un párrafo en HTML?

Él '

La etiqueta ” se utiliza para incrustar el párrafo en el documento HTML:

< pag > Esta es una etiqueta de párrafo pag >

Producción

Ejemplo 2: ¿Cómo agregar encabezados en HTML?

Hay seis niveles de etiquetas de contenedores de encabezados que se pueden usar para agregar encabezados a una página web. Pongámoslos en un documento HTML para ver cómo funcionan y se ven en una página web:

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

Producción

Podemos proporcionar el estilo en línea a estas etiquetas. Considere el siguiente ejemplo, que muestra cómo aplicar varias propiedades de estilo CSS a estas etiquetas:

< h1 estilo = 'color de fondo: cardo; familia de fuentes: cursiva;' > linux h1 >
< h2 estilo = 'color de fondo: trigo; alineación de texto: centro;' > linux h2 >
< h3 estilo = 'color de fondo: tomate; color: blanco;' > linux h3 >
< h4 estilo = 'familia de fuentes: 'Trebuchet MS'; color de fondo: verde amarillo;' > linux h4 >
< h5 estilo = 'color de fondo: violeta'; > linux h5 >
< h6 estilo = 'color de fondo: humo blanco'; > linux h6 & gt

Aquí está la explicación de las propiedades mencionadas anteriormente:

  • Él ' color de fondo La propiedad ” agrega color al fondo del elemento.
  • Familia tipográfica La propiedad ” ajusta el estilo de fuente del elemento.
  • texto alineado La propiedad ” ajusta la ubicación o alineación del texto.

Producción

Le mostramos cómo usar las etiquetas vacías y contenedoras de HTML.

Conclusión

Las etiquetas vacías y las etiquetas de contenedor son componentes principales de los documentos HTML que incrustan el contenido y la información en una página web. Las etiquetas vacías no contienen ningún contenido y consisten solo en la etiqueta de inicio con una barra invertida al final, como
. Sin embargo, las etiquetas de contenedor contienen las etiquetas de inicio y finalización junto con el contenido. Este blog ha elaborado sobre el funcionamiento de elementos vacíos y contenedores en HTML.