Exemplo
Reorganizar a direção dos itens flexíveis dentro do <div> elemento:
document.getElementById("main").style.flexDirection = "column-reverse"; Tente você mesmo " Definição e Uso
Os conjuntos de propriedades flexDirection ou retorna a direção dos itens flexíveis.
Note: Se o elemento não é um item flexível, a propriedade flexDirection não tem efeito.
Suporte navegador
A propriedade flexDirection é suportado no IE10 +, Firefox, Opera e Chrome.
Nota: Safari 6.1+ suporta uma alternativa, a propriedade WebkitFlexDirection.
Sintaxe
Devolver o imóvel flexDirection:
object .style.flexDirectionDefina a propriedade flexDirection:
object .style.flexDirection="row|row-reverse|column|column-reverse|initial|inherit"
Valores de propriedade
| Valor | Descrição |
|---|---|
| row | Valor padrão. Os itens flexíveis são exibidas horizontalmente, como uma linha |
| row-reverse | Mesmo como linha, mas na ordem inversa |
| column | Os artigos flexíveis são apresentadas na vertical, tal como uma coluna |
| column-reverse | Mesmo como coluna, mas na ordem inversa |
| initial | Define essa propriedade para seu valor padrão. Leia sobre inicial |
| inherit | Herda esta propriedade a partir de seu elemento pai. Leia sobre herdar |
Detalhes técnicos
| Valor padrão: | linha |
|---|---|
| Valor de retorno: | Uma corda, que representa a propriedade de flex-sentido de um elemento |
| CSS Versão | CSS3 |
Páginas relacionadas
Referência CSS: flex-direction property
HTML DOM estilo de referência: flex property
HTML DOM estilo de referência: flexBasis property
HTML DOM estilo de referência: flexFlow property
HTML DOM estilo de referência: flexGrow property
HTML DOM estilo de referência: flexShrink property
HTML DOM estilo de referência: flexWrap property
<Estilo de objeto