css之div未知高度，剩余div铺满整个屏幕

<div id="content">
            <div class="title">
            title1
            </div>
             <div class="title">
            title2
            </div>
             <div class="title">
            title3
            </div>
            <div id="article"></div>
</div>

当我们不知道class为title的div中内容有多高的时候，但是需要让article铺满剩余屏幕的时候，需要将content变为弹性盒，具体代码如下

.content{
display: flex;
flex-direction:column;
}
#article{
flex: 1
}

这样就可以了