display:flex與display:box 區別

antzone發表於2019-07-18
Flex

不少朋友在學習彈性佈局的時候會遇到兩種語法，display:flex與display:box。

它們兩個區別在於語法版本的新舊：

（1）.display:box是2009年的語法版本，當前已經不推薦使用。

（2）.display:flex是2012年最新修正的語法版本，瀏覽器支援較好，也將成為以後標準的語法。

瀏覽器支援：

a:3:{s:3:\"pic\";s:43:\"portal/201704/09/105202erqxrddgdorxoqq2.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

比較完整的相容性程式碼如下：

[CSS] 純文字檢視 複製程式碼
.box {
  display:-webkit-box; 
  display:-moz-box; 
  display:-webkit-flex; 
  display:-moz-flex; 
  display:-ms-flexbox; 
  display:flex; 
}

彈性佈局可以參閱display:flex 彈性佈局一章節。

相關文章