css order code example
Example 1: flex change order
.box {
display: flex;
flex-direction: row;
}
.box :nth-child(1) { order: 2; }
.box :nth-child(2) { order: 3; }
.box :nth-child(3) { order: 1; }
.box :nth-child(4) { order: 4; }
.box :nth-child(5) { order: 5; }
Example 2: css change ul order
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<style>
ul {
display: flex;
flex-direction: column;
}
ul li:first-child {
order: 5;
}
ul li:nth-child(2) {
order: 4;
}
ul li:nth-child(3) {
order: 3;
}
ul li:nth-child(4) {
order: 2;
}
</style>