HTML Div Etiqueta | explicado
Un DIV puede contener varias otras divisiones y cada DIV contiene varias propiedades de estilo. El propósito principal de un DIV es hacer un grupo de tipos similares de elementos para que puedan diseñarse fácilmente. Debido a su funcionalidad extendida, se conoce como la etiqueta clave al desarrollar una página web utilizando HTML. En este artículo, hemos demostrado el funcionamiento de la etiqueta Div, y se ilustran algunos ejemplos para mostrar el uso de la etiqueta Div.
Cómo funciona la etiqueta HTML Div
La etiqueta Div comprende etiquetas de inicio y cierre y la siguiente sintaxis se usa para crear un DIV en HTML.
Cualquier cosa escrita entre estas etiquetas adoptará los valores establecidos para este div. Para una comprensión básica, se crea un DIV utilizando el siguiente código.
Etiqueta Div Se crea un div en la página web
esto es div
El código se describe de la siguiente manera:
- El título de la página será "Div Tag"
- El fondo del cuerpo está configurado como "verde marino de mar"
- Se crea un div y su color de fondo está establecido en "amarillo"
- Se crea un párrafo en la etiqueta Div
La imagen del código se proporciona a continuación:
La salida de la página web se muestra a continuación:
Las siguientes observaciones se pueden hacer a partir de la salida anterior:
- La etiqueta Div crea una nueva línea
- Ocupa todo el ancho (si el límite no está configurado) de la página
Cómo usar la etiqueta Div HTML
El funcionamiento básico de la etiqueta Div se explica en la sección anterior. Sin embargo, esta sección explica el uso de la etiqueta HTML div en varios escenarios. Como se indicó anteriormente, los elementos múltiples están contenidos en un DIV para diseñar todos estos elementos de manera similar. Como el estilo es posible con CSS, se recomienda usar una clase CSS en línea o externa.
Ejemplo 1: Uso de una etiqueta HTML DIV con múltiples clases de CSS
Se puede usar una etiqueta Div con múltiples clases de CSS. Para practicar esta funcionalidad, se utiliza el siguiente código HTML:
Etiqueta Div El div uso de dos clases de CSS
Bienvenido a Linuxhint
Un valle de tecnología
El código se describe a continuación:
- Se crean dos clases de CSS llamadas "Color" y "Misc".
- La clase de color define "color de fondo" y "color de fuente", mientras que la clase miscelánea contiene el "ancho", el "relleno" y el "estilo de fuente"
- Se crea un DIV con un atributo de clase y usa el nombre de ambas clases en él
- Tres elementos HTML
,
y se usan en el div
Nota: Al usar múltiples nombres de clases en un atributo de clase de la etiqueta DIV, debe agregar un espacio entre los nombres de clases para diferenciar ambas clases.
La imagen del código se proporciona a continuación:
A continuación se muestra la salida del código HTML en una página web:
Ejemplo 2: Uso de múltiples etiquetas DIV
Usar múltiples div es la parte confusa de la etiqueta HTML Div. El siguiente código HTML se refiere a usar múltiples divs con varios
Etiqueta Div Primer Div
Bienvenido a Linuxhint
Segundo Div
proveedor de contenido líder
El código se describe como:
- Creó dos clases de CSS llamadas "Primero" y "Segundo"
- La "primera clase" define "color de fondo", "color de la fuente", ancho, "flotación"
- La "segunda" clase tiene propiedades como "color de fondo", "ancho", "flotación"
- Un DIV se inicializa con un atributo de clase y "primero" como el valor del atributo
- Otro div se crea con "segundo" como un valor del atributo de clase
La imagen del código se muestra a continuación:
La salida de la página web se muestra a continuación:
Conclusión
La etiqueta Div en HTML se refiere a crear un contenedor que le permite hacer un grupo de elementos HTML que se puedan diseñar de la misma manera. Este artículo demostró el mecanismo de trabajo de la etiqueta Div. Además, se dicen varios ejemplos que muestran cómo se puede usar una etiqueta HTML DIV en varios escenarios.