简写的flex:1的完整写法是什么?
flex: 1 的完整写法是 flex: 1 1 0%。
这三个值分别代表:
-
flex-grow: 1: 定义项目的放大比例。值为1表示该项目将和其他flex-grow值不为0的项目按比例瓜分剩余空间。如果其他项目的flex-grow都为0,那么这个项目将占据所有剩余空间。 -
flex-shrink: 1: 定义项目的缩小比例。值为1表示当空间不足时,该项目将和其他flex-shrink值不为0的项目按比例缩小。如果其他项目的flex-shrink都为0,那么这个项目将按比例缩小以适应容器。 -
flex-basis: 0%: 定义项目的初始大小。0%表示初始大小为0,这意味着在分配剩余空间之前,该项目不会占用任何空间。 这与auto不同,auto会根据内容计算初始大小。
因此,flex: 1 是一种简写,它使项目能够灵活地填充可用空间,并在必要时进行收缩。 它等同于设置 flex-grow 为 1,flex-shrink 为 1,以及 flex-basis 为 0%。
浙公网安备 33010602011771号