欢迎来到网页工程C工作坊!工作坊的主要目的是为大家提供一些有关网页设计及开发等等的热门资讯,希望大家可以将资讯用于自己的作品上,以及能启发大家的创作灵感!
flex-grow 是用作控制当 item 向外放大至填满 container 时,放大的相对比率。留意以下例子:
由于 item1 的 flex-grow 是1,而其它是0,item1就会自动放大,填满所有空间,而 item2 及 item3 维持大小不变。
若分别将 item2 及 item3 也加入 flex-grow:1 的设定,由于每个 item 的放大比率也一样,就会形成相同比率地放大至填满 container:
最后,看看若把每个 item 的 flex-grow 设定为不同时:
