html调整div上下顺序,使用CSS更改DOM元素顺序（Crocodoc）

我很晚参加派对，但我只是想让大家知道你实际上可以单独使用CSS来更改DOM顺序。

尽管要做到这一点，我们必须使用CSS3 flexbox语法。所以基本上IE10 +在我的情况下通常不会成为问题，因为我使用它来操作移动网站。

那么我们该怎么做呢？ 父级需要成为Flexbox元素。例如：

(仅使用此WebKit的供应商前缀的CSS是耀眼的，因为它是没有它。)

#main {

display: -webkit-box;

display: -webkit-flex;

display: flex;

-webkit-box-orient: vertical;

-webkit-flex-direction: column;

flex-direction: column;

-webkit-box-align: start;

-webkit-align-items: flex-start;

align-items: flex-start;

}

然后，交换的div各地通过指示与它们的顺序：

#main > div#one{

-webkit-box-ordinal-group: 2;

-moz-box-ordinal-group: 2;

-ms-flex-order: 2;

-webkit-order: 2;

order: 2;

overflow:visible;

}

#main > div#two{

-webkit-box-ordinal-group: 1;

-moz-box-ordinal-group: 1;

-ms-flex-order: 1;

-webkit-order: 1;

order: 1;

}

祝你好运！