CSS order 屬性

定義和用法

order 屬性規定彈性項目相對于同一容器內其余彈性項目的順序。

注釋：如果元素不是彈性項目，則 order 屬性無效。

另請參閱：

CSS 參考手冊：flex 屬性

CSS 參考手冊：flex-basis 屬性

CSS 參考手冊：flex-direction 屬性

CSS 參考手冊：flex-flow 屬性

CSS 參考手冊：flex-grow 屬性

CSS 參考手冊：flex-shrink 屬性

CSS 參考手冊：flex-wrap 屬性

CSS 參考手冊：align-content 屬性

CSS 參考手冊：align-items 屬性

CSS 參考手冊：align-self 屬性

HTML DOM 參考手冊：order 屬性

實例

設置彈性項目的順序：

div#myRedDIV {order: 2;}
div#myBlueDIV {order: 4;}
div#myGreenDIV {order: 3;}
div#myPinkDIV {order: 1;}

親自試一試

CSS 語法

order: number|initial|inherit;

屬性值

值 描述
number 默認值為 0。規定彈性項目的順序。
initial 將此屬性設置為其默認值。參閱 initial。
inherit 從其父元素繼承此屬性。參閱 inherit。

技術細節

默認值： 0
繼承： no
動畫制作： 支持。請參閱單獨的屬性。請參閱：動畫相關屬性。
版本： CSS3
JavaScript 語法： object.style.order="2"

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

跟隨 -webkit- 或 -moz- 的數字規定使用前綴的首個版本。

Chrome IE / Edge Firefox Safari Opera
29.0
21.0 -webkit- 		11.0 28.0
18.0 -moz- 		9.0
6.1 -webkit- 		17.0