Flexbox中的第一个孩子全角
如何在flexbox全角中设置第一个孩子，并将其他所有孩子设置为flex:1（拆分空间）？
像这样：
您可以将的:first-child宽度设置为100％，其余的设置:not(:first-child)为flex: 1。要将它们放在多行上，请flex-wrap: wrap在容器上使用：
.container {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
background: #e2eaf4;
padding: 10px;
}
.child {
display: inline-block;
font-family: "Open Sans", Arial;
font-size: 20px;
color: #FFF;
text-align: center;
background: #3794fe;
border-radius: 6px;
padding: 20px;
margin: 12px;
}
.child:first-child {
width: 100%;
}
.child:not(:first-child) {
flex: 1;
}<div class="container">
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
祖先CSS的第一个孩子
- 2
使用第一个孩子和之前的CSS
- 3
多个表的CSS第一个孩子
- 4
选择第一个孩子以外的奇数元素
- 5
：ng-repeat的第一个孩子
- 6
如何获得第一个标头孩子？
- 7
根据属性选择第一个孩子
- 8
DIV上的第一个孩子选择无效
- 9
针对CSS课后的第一个孩子
- 10
CSS：第一个孩子的伪元素
- 11
JSoup获得div的第一个孩子
- 12
祖父母的第一个孩子
- 13
向第一个孩子添加id属性
- 14
第一个孩子的价值的Firebase规则
- 15
如何使用Flexbox将第二个孩子包裹在第一个孩子周围
- 16
第一个孩子在自己的行上
- 17
::与第一个孩子的内容相同
- 18
：带嵌套元素的第一个孩子
- 19
生第一个孩子
- 20
如何选择特定的第一个孩子
- 21
将DIV中的第一个孩子作为jQuery中的UL元素进行操作
- 22
div的第一个孩子
- 23
CSS：有班级的孩子的第一个孩子
- 24
CSS中的第一个孩子问题
- 25
选择嵌套div中的第一个孩子
- 26
在第一个孩子和下一个孩子样式中添加CSS？
- 27
如何在CSS中定义孩子的孩子而不提及第一个孩子？
- 28
第一个孩子的选择
- 29
如何在第一个孩子中选择第一个孩子
我来说两句