Here is a "simple as possible" example, for changing the order of div-elements (when resizing the browser window):
<!DOCTYPE html>
<html>
<head>
<title>foobar</title>
<style>
@media screen and (max-width:300px){
#parent{
display:flex;
flex-flow: column;
}
#a{order:2;}
#c{order:1;}
#b{order:3;}
}
</style>
</head>
<body>
<div id="parent">
<div id="a">one</div>
<div id="b">two</div>
<div id="c">three</div>
</div>
</body>
</html>
Example:
http://jsfiddle.net/devnull/qyroxexv/
(change window-width to see the effect of changing the order of the divs)
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…