imagen de ∗FranJa
¿Estás seguro que sabes cuando usar el elemento div?
Todo el que ha visto código HTML conoce el elemento <div>, de hecho es uno de los elementos más usados en HTML, pero a veces, a muchos se les pasa la mano y empiezan a usarlo de más.
es un elemento de construcción
Ya hablaré después del mal uso que se le da al pobre <div>, ahora toca explicar que es y para que sirve este elemento.
<div>, que es y para que sirve.
El elemento <div> es un elemento de bloque y sirve para separar secciones lógicas en una página web.
Por ejemplo, tienes una página que habla de computadoras, con dos secciones Mac y PC, y en cada sección describes sus características.
Imagina que esta es la estructura de tu página:
Ahora, debería haber una forma de diferenciar esas secciones en tu HTML, y de hecho la hay. tienes a tu buen amigo, el elemento <div>.
Lo que hay que hacer primero es encerrar cada sección entre <div> y </div>, tu página quedaría así.
Ya tienes separadas ambas secciones, pero parece que falta algo, separar secciones así nada más no dice mucho, lo que hay que hacer es darle más significado.
Para eso tenemos al atributo id, entonces, para que el HTML de esa página describa correctamente su contenido, sólo tenemos que agregar un id a cada div de la siguiente manera: <div id="pc"> y <div id="mac">.
Y aquí está el resultado.
Pero ahí no acaba todo, supón que el elemento <h1> que aparece arriba sea una cabera, y el ultimo párrafo <p> sea un pie de página (footer).
Estas también son secciones lógicas así que se podrían marcar con <div>s agregando sus respectivos atributos id.
Este marcado con divs es básico, de hecho se le puede dar mayor significado usando ids más semánticos, pero eso quedará para el siguiente post.
Recomendación final
No abuses de los <div>s. Úsalos sólo para marcar secciones lógicas en tus páginas para hacerlas más claras y poder darles estilos específicos usado CSS.
Agregar <div>s sin ninguna razón sólo hará tu código mucho más complicado y no te dará ningún beneficio.
Etiquetas:
si te gustó esta entrada, tal vez quieras suscribirte via RSS
Hola, soy
Comentarios
deja un comentario
Después de pasear por varios sitios buscando una respuesta encontrar tu blog es un alivio: claro, conciso, directo, valioso.
Me da gusto que un compatriota sea administrador de este lugar.
Gracias Germán, de veras,
Pablo
Muchas gracias Pablo!
la mejor explicacion que pude encontrar en la red felicidades y gracias
gracias...la explicación es antitontos...
Excelente explicacion sobre los Div antes de llegar aca no encontre absolutamente nada
un abrazo!
hola... un web site totalmente amigable y concreto...
pero me hubiera gustado que compartieras con nosotros como podemos utilizar la función Id del div...
es decir que nos des la opción de mostrar y/O ocultar nuestros DIV.
gracias
hola amigo jejeje,,, no creas ke nos pusimos de acuerdo en alagarte pero sinceramente tu explicacion sobre divs es muy concreto. me gustaria saber mas sobre div ke puedo hacer
Sinceramente, para aquellos que tenemos ganas de aprender, tu página es la mejor. Simple y sin dar las cosas por sobreentendidas. Una vez más FELICITACIONES!
Excelente blog, explican de una manera sencilla y amigable a la vista de forma que resulta simple de entender.
Deja un comentario