如何让div中的子类div的高度和父类高度一样

时间:2024-03-15 20:31:39

在默认情况下(没有设置浮动或定位时),子级div元素本身宽度就是占满父级宽度的100%的。
如果还希望让子级div的高度占满父级,那么为子级div增加“height: 100%”的样式即可

注意:(前提是你的父级div存在固定高度)

 

<row style="height: 300px">
    <i-col span="10"  style="display: flex;justify-content:center;align-items: center;height: 100%">
        <div style="margin:30px auto;">
            <img style="height: 50px;width: 50px" src="/static/modules/index/images/soldier.png" alt="">
        </div>
    </i-col>
    <i-col span="14"  style="display: flex;flex-direction: column;justify-content:center;height: 100%">
        <div>
            选择日期:
        </div>
        <div>
            选择日期:
        </div>
        <div>
            选择日期:
        </div>
    </i-col>
</row>

如何让div中的子类div的高度和父类高度一样

应用场景,此功能主要是用来控制,所有的元素统一垂直居中