Índice

Anterior

Siguiente

Versión Imprimible

Autores

Volver

 

2. La propiedad display.

Como hemos comentado, la propiedad display permite cambiar el tipo en que son mostrados los elementos. Su sintaxis es la siguiente:

display

Sintaxis:	display: <valor>
Valores posibles:	inline | block | list-item | run-in | compact | marker | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit
Valor inicial:	El que tenga por defecto cada elemento.
Se aplica a:	Todos los elementos
Heredado:	No

Vemos el significado de alguno de estos valores:

block

Este valor provoca que un elemento genere una caja de bloque principal

inline

Este valor provoca que un elemento genere una o más cajas de línea

list-item

Este valor provoca que un elemento genere una caja de bloque principal y una caja de línea list-item (por detalles ver la sección sobre listas)

marker

Este valor declara que el contenido generado antes o después de una caja será un marcador (por detalles ver la sección sobre marcadores)

none

Este valor provoca que un elemento no genere ninguna caja (es decir, el elemento no tiene ningún efecto sobre la composición) y los elementos descendientes tampoco generan cajas. Hay que destacar que este valor no crea una caja invisible sino que hace que el elemento desaparezca por completo. Esa es la diferencia con las propiedades sobre visibilidad que provocan que un elemento pueda ser invisible pero siga ocupando un espacio en la página

run-in y compact

Estos valores crean cajas de bloque o de línea según el contexto y tienen un comportamiento como el que conocemos para las listas de definiciones

table, inline-table, table-row-group, table-column, table-column-group, table-header-group, table-footer-group, table-row, table-cell y table-caption

Estos valores provocan que un elemento se comporte como un elemento de una tabla. Usándolos podemos conseguir que cualquier elemento se comporte como una tabla o como parte de una tabla. Con HTML no tiene mucho sentido ya que existen elementos como las tablas, columnas y celdas, pero otros lenguajes (XML, por ejemplo) no tienen dichos elementos.