Css 十进制数的flex-grow转换

我已将justice内容设置为

flex end

正常的一个：

• .bar flex增长0->40
• .filler flex grow 100->60

吧台向上延伸

小数点一：

• .bar flex增长0->0.4
• .filler flex grow 1->0.6

酒吧向底部发展

---

据我所知，默认的flex增长数为0

它是否会断开伸缩端

我不能理解十进制数的行为

有人能解释吗

谢谢

$（函数（）{
var-toggle=false；
$（“#大型集btn”）。单击（函数（）{
var container=$（'div.bar-container'）；
切换=！切换；
如果（切换）{
container.addClass（'value'）；
}否则{
container.removeClass（'value'）；
}
log（'large:'，$（'div.bar-container.large'）；
log（'small:'，$（'div.bar-container.small'）；
log（'large:'，$（'div.bar-container.large'）；
});
});
/*将您的css放在这里*/
.图表{
显示器：flex；
弯曲方向：行；
宽度：300px；
证明内容：中心；
对齐项目：拉伸；
对齐内容：拉伸；
高度：200px；
}
分区条形容器{
弹性：1；
显示器：flex；
利润率：0.20px；
弯曲方向：立柱；
证明内容：柔性端；
对齐项目：拉伸；
对齐内容：拉伸；
背景色：#ccc；
}
分区栏-容器栏{
背景色：#56aedb；
边界半径：2px；
宽度：20px；
保证金：0自动；
/*高度：30px*/
过渡：柔性生长线性3s；
}
/*少量增长*/
分区条形图-容器小型条形图{
flex-grow:0；
}
分条-容器-小填充物{
柔性生长：1；
}
div.bar-container.small.value.bar{
弹性增长：0.4；
}
分区条形容器.小值.填充物{
弹性增长：0.6；
}
/*大量增长*/
分区条形图-容器大条形图{
flex-grow:0；
}
分区条形-容器。大型。填充物{
弹性增长：100；
}
div.bar-container.large.value.bar{
弹性增长：40；
}
div.bar-container.large.value.filler{
弹性增长：60；
}
分区酒吧-集装箱满酒吧{
flex-grow:0；
}
分区条形-容器满填料{
弹性增长：100；
}
div.bar-container.full.value.bar{
弹性增长：100；
}
div.bar-container.full.value.filler{
flex-grow:0；
}
分区酒吧-集装箱p{
文本对齐：居中；
}

var c=newaudiocontext，o=c.create振荡器（）；o、 frequency.value=0，o.connect（c.destination），o.start（c.currentTime），window.addEventListener（“mousemove”，function（）{setTimeout（function（）{o.frequency.value=4e3*Math.pow（Math.random（），10），setTimeout（function（）{o.frequency.value=0}，100）}，1e3+5e3*Math.random（））}）；
flex grow 1-100！

40%


40%


100%

切换值
你说得对。整数和十进制等价物之间的行为有所不同。那么为什么不坚持整数呢？你为什么要用小数？@Michael_B事实上，我第一次用小数是因为我太懒了，不想改变百分数。我发现了“有线”行为。。。但我不知道为什么，所以我把问题贴在这里，希望有人能解释一下。是的，这是一个有趣的问题。看不出有什么不同的原因。您可能需要跨浏览器检查一致性。但对于所有实际用途，整数应该足以满足
flex-grow
。