Ejemplo
Establecer el orden de los elementos flexibles:
/* Code for Safari 6.1 to 8.0 */
div#myRedDIV {-webkit-order: 2;}
div#myBlueDIV {-webkit-order: 4;}
div#myGreenDIV {-webkit-order: 3;}
div#myPinkDIV {-webkit-order: 1;}
/* Standard syntax */
div#myRedDIV {order: 2;}
div#myBlueDIV {order: 4;}
div#myGreenDIV
{order: 3;}
div#myPinkDIV {order: 1;}
Inténtalo tú mismo " Definición y Uso
La propiedad de orden especifica el orden de un elemento flexible, en relación con el resto de los elementos flexibles en el interior del mismo contenedor.
Note: Si el elemento no es un elemento de flexibilidad, la propiedad fin no tiene ningún efecto.
| Valor por defecto: | 0 |
|---|---|
| Heredado: | no |
| animatable: | yes, see individual properties . Read about animatable Try it |
| Versión: | CSS3 |
| la sintaxis de JavaScript: | object .style.order="2" Try it |
Soporte para el navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Los números seguidos por -webkit- o -moz- especifican la primera versión que funcionaba con un prefijo.
| Propiedad | |||||
|---|---|---|---|---|---|
| order | 29.0 21.0 -webkit- | 11.0 | 28.0 18.0 -moz- | 9.0 6.1 -webkit- | 17.0 |
sintaxis CSS
order:number|initial|inherit;Valores de propiedad
| Valor | Descripción |
|---|---|
| number | El valor por defecto 0. Especifica el pedido para el artículo flexibles |
| initial | Establece esta propiedad a su valor por defecto. Lea acerca inicial |
| inherit | Hereda esta propiedad de su elemento padre. Lee sobre heredar |
Páginas relacionadas
CSS Referencia: flex property
CSS Referencia: flex-basis property
CSS Referencia: flex-direction property
CSS Referencia: flex-flow property
CSS Referencia: flex-grow property
CSS Referencia: flex-shrink property
CSS Referencia: flex-wrap property
CSS Referencia: align-content property
CSS Referencia: align-items property
CSS Referencia: align-self property
Referencia HTML DOM: order property