Style flexFlow 屬性

定義和用法

flexFlow 屬性是 flexDirection 和 flexWrap 屬性的簡寫屬性。

flexDirection 屬性規定彈性項的方向。

flexWrap 屬性規定彈性項目是否應該換行。

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

另請參閱：

CSS 參考手冊：flex-flow 屬性

實例

使彈性項按列顯示，并且不換行：

document.getElementById("main").style.flexFlow = "column nowrap";

親自試一試

語法

返回 flexFlow 屬性：

object.style.flexFlow

設置 flexFlow 屬性：

object.style.flexFlow = "flex-direction flex-wrap|initial|inherit"

屬性值

值 描述
flex-direction

可能的值：

  • row
  • row-reverse
  • column
  • column-reverse
  • initial
  • inherit

默認值是 "row"。

規定彈性項目的方向。
flex-wrap

可能的值：

  • nowrap
  • wrap
  • wrap-reverse
  • initial
  • inherit

默認值是 "nowrap"。

規定彈性項目是否應該換行。
initial 將此屬性設置為其默認值。請參閱 initial。
inherit 從其父元素繼承此屬性。請參閱 inherit。

技術細節

默認值： row nowrap
返回值： 字符串，表示元素的 flex-flow 屬性。
CSS 版本： CSS3

瀏覽器支持

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

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 11.0 支持 9.0 支持

相關頁面

HTML DOM STYLE 參考手冊：flex 屬性

HTML DOM STYLE 參考手冊：flexBasis 屬性

HTML DOM STYLE 參考手冊：flexDirection 屬性

HTML DOM STYLE 參考手冊：flexGrow 屬性

HTML DOM STYLE 參考手冊：flexShrink 屬性

HTML DOM STYLE 參考手冊：flexWrap 屬性