Ejemplo
Reorganizar la dirección de los elementos flexibles dentro de la <div> elemento:
document.getElementById("main").style.flexDirection = "column-reverse";
Inténtalo tú mismo " Definición y Uso
Los conjuntos de propiedades flexDirection o devuelve la dirección de los elementos flexibles.
Note: Si el elemento no es un elemento de flexibilidad, la propiedad flexDirection no tiene ningún efecto.
Soporte del navegador
La propiedad flexDirection se apoya en IE10 +, Firefox, Opera y Chrome.
Nota: Safari 6.1+ soporta una alternativa, la propiedad WebkitFlexDirection.
Sintaxis
Devolver la propiedad flexDirection:
object .style.flexDirection
Establecer la propiedad flexDirection:
object .style.flexDirection="row|row-reverse|column|column-reverse|initial|inherit"
Valores de propiedad
Valor | Descripción |
---|---|
row | Valor por defecto. Los elementos flexibles se muestran en horizontal, como una fila |
row-reverse | Igual que la fila, pero en orden inverso |
column | Los elementos flexibles se muestran verticalmente, como una columna |
column-reverse | Igual que la columna, pero en orden inverso |
initial | Establece esta propiedad a su valor por defecto. Lea acerca inicial |
inherit | Hereda esta propiedad de su elemento padre. Lea acerca de heredar |
Detalles técnicos
Valor por defecto: | fila |
---|---|
Valor de retorno: | Una cadena, que representa la propiedad flex-dirección de un elemento |
Versión CSS | CSS3 |
Páginas relacionadas
Referencia CSS: flex-direction property
HTML DOM estilo de referencia: flex property
HTML DOM estilo de referencia: flexBasis property
HTML DOM estilo de referencia: flexFlow property
HTML DOM estilo de referencia: flexGrow property
HTML DOM estilo de referencia: flexShrink property
HTML DOM estilo de referencia: flexWrap property
<Estilo de objeto