Please enable JavaScript.
Coggle requires JavaScript to display documents.
POSICIONAMIENTO Y VISUALIZACIÓN (Posicionamiento (• Posicionamiento…
POSICIONAMIENTO Y VISUALIZACIÓN
Tipos de elementos
1. Los elementos de bloque
("block elements" en inglés) siempre empiezan en una nueva línea y ocupan todo el espacio disponible hasta el final de la línea.
•
Los elementos de bloque definidos por HTML
son: address, blockquote, center, dir, div, dl, fieldset, form, h1, h2, h3, h4, h5, h6, hr, isindex, menu, noframes, noscript, ol, p, pre, table, ul.
2. los elementos en línea
("inline elements" en inglés) no empiezan necesariamente en nueva línea y sólo ocupan el espacio necesario para mostrar sus contenidos.
•
Los elementos en línea definidos por HTML
son: a, abbr, acronym, b, basefont, bdo, big, br, cite, code, dfn, em, font, i, img, input, kbd, label, q, s, samp, select, small, span, strike, strong, sub, sup, textarea, tt, u, var.
Posicionamiento
•
Posicionamiento normal o estático
: se trata del posicionamiento que utilizan los navegadores si no se indica lo contrario.
•
Posicionamiento relativo:
variante del posicionamiento normal que consiste en posicionar una caja según el posicionamiento normal y después desplazarla respecto de su posición original.
•
Posicionamiento absoluto:
la posición de una caja se establece de forma absoluta respecto de su elemento contenedor y el resto de elementos de la página ignoran la nueva posición del elemento.
•
Posicionamiento fijo:
variante del posicionamiento absoluto que convierte una caja en un elemento inamovible, de forma que su posición en la pantalla siempre es la misma independientemente del resto de elementos e independientemente de si el usuario sube o baja la página en la ventana del navegador.
•
Posicionamiento flotante:
se trata del modelo más especial de posicionamiento, ya que desplaza las cajas todo lo posible hacia la izquierda o hacia la derecha de la línea en la que se encuentran.
Visualización
Propiedades display y visibility
La propiedad display
permite ocultar completamente un elemento haciendo que desaparezca de la página. Como el elemento oculto no se muestra, el resto de elementos de la página se mueven para ocupar su lugar
la propiedad visibility
permite hacer invisible un elemento, lo que significa que el navegador crea la caja del elemento pero no la muestra. En este caso, el resto de elementos de la página no modifican su posición, ya que aunque la caja no se ve, sigue ocupando sitio.
Propiedad overflow
CSS define la propiedad overflow para controlar la forma en la que se visualizan los contenidos que sobresalen de sus elementos.
Propiedad z-index
•
La posición tridimensiona
l de un elemento se establece sobre un tercer eje llamado Z y se controla mediante la propiedad z-index. Utilizando esta propiedad es posible crear páginas complejas con varios niveles o capas