Stories

Detail Return Return

flex佈局中flex-basis屬性 - Stories Detail

該屬性的取值

  1. 數值、百分比
  2. auto
  3. content

數值、百分比

指定數值、百分比,該元素的寬度為指定寬度
flex-basis: 200px;
flex-basis: 50%;

auto

指定auto,該元素的寬度為自身的width屬性寬度,如果沒有設置width,則為內容撐開的寬度
flex-basis: auto;

content

指定content,該元素的寬度為內容撐開的寬度,它和auto不一樣,auto會優先讀取width,如果沒有設置width屬性,元素的寬度才為內容撐開的寬度

flex-basis的優先級比width高

.flex-item {
    width: 200px;
    flex-basis: 300px;
    // 元素的最終寬度會為300px
}

.flex-item {
    width: 200px;
    flex-basis: content;
    // 元素的最終寬度會為內容撐開的寬度,而不是200px
}
user avatar cyzf Avatar alibabawenyujishu Avatar guochenglong Avatar kobe_fans_zxc Avatar leexiaohui1997 Avatar qian5201314 Avatar yulong1992 Avatar taotao123 Avatar nihaoanihao Avatar potato1314 Avatar haoqidewukong Avatar prosuoqi Avatar
Favorites 50 users favorite the story!
Favorites

Add a new Comments

Some HTML is okay.