flex:1表示哪三個屬性?

flex: 1flex-grow: 1, flex-shrink: 1, flex-basis: 0 的合併寫法。

  • flex-grow 屬性規定項目的放大比例,默認值爲0,即如果存在剩餘空間,也不放大。如果所有項目的 flex-grow 屬性都爲1,則它們將等分剩餘空間,如果一個項目的 flex-grow 屬性值爲2,其它爲1,則前者佔據的剩餘空間將比其他項多一倍。
  • flex-shrink 屬性規定了項目的縮小比例,默認爲1,即如果空間不足,該項目將縮小。如果所有項目的 flex-shrink 屬性都爲1,當空間不足時,都將等比例縮小;如果一個項目的 flex-shrink 屬性值爲0,其他項目都爲1,則空間不足時,前者不縮小。
  • flex-basis 屬性用於設置項目在主軸方向上的初始尺寸。默認值爲auto,即項目的本來大小。另外,可以設置具體長度或百分比等樣式。

flex: 1 表示項目會等比例地佔據剩餘的空間,而 flex: auto,則會根據項目原始尺寸佔據空間(如果有剩餘空間也不會放大項目),如果 flex-basis 值不爲0,則根據 flex-basis 來佔據空間。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章