Los últimos tutoriales de desarrollo web
 

Style flex Property

<Estilo de objeto

Ejemplo

Que todos los elementos flexibles tener la misma longitud, regardles de su contenido:

for (i = 0; i < y.length; i++) {
    y[i].style.flex = "1";
}
Inténtalo tú mismo "

Definición y Uso

Los conjuntos de propiedades de flexión o devuelve la longitud del artículo, en relación con el resto de los artículos Flexibel dentro del mismo contenedor.

La propiedad flex es una abreviatura para el flexGrow, flexShrink, y las propiedades flexBasis.

Note: Si el elemento no es un elemento flexible, el flex propiedad no tiene ningún efecto.


Soporte del navegador

Internet ExplorerFirefoxOperaGoogle ChromeSafari

La propiedad flex es compatible con todos los navegadores, a excepción de Safari.

Nota: La propiedad flex no es compatible con IE 9 o anterior, es decir, 10 en esta propiedad es compatible con el prefijo MS. EI11 y las nuevas versiones son totalmente compatibles con la propiedad de la flexión (no se necesita el prefijo ms).

Nota: Safari 6.1+ soporta una alternativa, la propiedad WebkitFlex.


Sintaxis

Devolver la propiedad a la flexión:

object .style.flex

Establecer la propiedad de flexión:

object .style.flex=" Valores de propiedad
Valor Descripción
flex-grow Un número que especifica la cantidad del elemento crecerá en relación con el resto de los elementos flexibles
flex-shrink Un número que especifica hasta qué punto el tema se reducirá en relación con el resto de los elementos flexibles
flex-basis La longitud del artículo. Los valores válidos: "auto" , "inherit" , o un número seguido de "%" , "px" , "em" o cualquier otra unidad de longitud
auto Igual que 1 1 automóvil.
initial Igual que 0 1 auto. Lea acerca inicial
none Igual que 0 0 auto.
inherit Hereda esta propiedad de su elemento padre. Lea acerca de heredar

Detalles técnicos

Valor por defecto: 0 1 auto
Valor de retorno: Una cadena, que representa la propiedad de la flexión de un elemento
Versión CSS CSS3

Páginas relacionadas

Referencia CSS: flex property

HTML DOM estilo de referencia: flexBasis property

HTML DOM estilo de referencia: flexDirection 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