CSS grid minmax()函数详解

CSS minmax() 函数详解

minmax() 是 CSS Grid 布局中的一个重要函数，用于定义网格轨道的尺寸范围（行高或列宽）。它允许你为一个网格轨道设置最小和最大尺寸限制，让布局在灵活性和可控性之间取得平衡。

MDN：developer.mozilla.org/en-US/docs/…

minmax() 函数可以在下列位置使用：

• grid-template-columns
• grid-template-rows
• grid-auto-columns
• grid-auto-rows

minmax(200px, 1fr)
minmax(400px, 50%)
minmax(100px, max-content)
minmax(max-content, auto)
minmax(auto, 300px)

repeat组合

grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));