Html 向一组div添加圆角

我有一个简单的水平div，有几个彩色的孩子：

.bar{
显示器：flex；
高度：90px；
边界半径：20px；
}

---

为什么不在条形图上添加边界半径并隐藏溢出：

.bar{
display:inline flex；/*使其成为inline，使其仅与子对象一样宽*/
高度：90px；
边界半径：25px；
溢出：隐藏；/*添加此*/
}

您能解释一下隐藏溢出是如何工作的吗？它工作得很好，谢谢。因为div中的内容溢出了圆角，所以它看起来像是父级上没有圆角。隐藏溢出可以说使角显示出来-即它阻止子内容溢出父边界