首頁 > web前端 > css教學 > 為什麼在 Flex 項目上設定固定高度不會影響其大小?

為什麼在 Flex 項目上設定固定高度不會影響其大小?

Barbara Streisand
發布: 2024-11-23 01:05:28
原創
690 人瀏覽過

Why Doesn't Setting a Fixed Height on a Flex Item Affect Its Size?

對於這個例子來說,處理這一行就足夠了:

.flex-item {
    ... ;
    height: auto;
}
登入後複製

修改它的值:

.flex-item {
    ... ;
    height: 50px;
}
登入後複製

這個修改將根本不改變任何東西。高度仍會自動計算。

要讓所有方形單元格讀取如下:

這是使用 Flexbox 使所有單元格成為方形的一種可能方法。

  1. 要限制縱橫比,無論是手動還是絕對值,請按照您已經做的那樣設定百分比。
  2. 然後重置這些儲存格上的 Flexbox 相關高度/寬度為自動。這些確保項目在更改時不會調整大小以適應容器大小。
.flex-item {
  ... ;
  height: auto;
  width: auto;
  min-width: 50px; /* minimum width of 50px; adapt to your needs */ 
}
登入後複製

以上是為什麼在 Flex 項目上設定固定高度不會影響其大小?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板