相关疑难解决方法(0)

在嵌套flex容器时正确使用flex属性

我在使用flexbox时遇到了问题,并且想要了解嵌套父元素和子元素的工作方式.

我知道孩子继承了父母的弹性.但如果你需要为孩子(宝宝)抚摸一个孩子,这会被覆盖吗?flexbox的正确用法是什么?

我什么时候都适用display: flex于孩子孩子(婴儿)的缘故,或将是覆盖孩子的父母柔性?

.parent-container {
  display: flex;
  flex: 1 0 100%;
  background-color:yellow;
}
.child-container {
  flex: 1 1 50%
  background-color: blue;
}
.baby-of-child-container {
  flex: 1 1 50%;
  background-color: green;
}
Run Code Online (Sandbox Code Playgroud)
<div class='parent-container'>
  <div class='child-container'>
    <div class='baby-of-child-container'>child</div>
    <div class='baby-of-child-container'>child</div>
  </div>
  <div class='child-container'>
    <div class='baby-of-child-container'>child</div>
    <div class='baby-of-child-container'>child</div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

html css flexbox

18
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×1

flexbox ×1

html ×1