小编Moh*_*idi的帖子

添加动画以进行flex-wrap

当涉及到包装点时我们如何添加动画?

也许这可以帮助:

我们有一个标题和标题内部我们有flex attr的容器,当我们从下到上调整浏览器的高度时,方向是列,或者当我们更改浏览器的高度时,这些项目突然重新形成,我只是想为此事件添加动画.谢谢

<header>
        <div class="container">
            <div class="item1 item"></div>
            <div class="item2 item"></div>
            <div class="item3 item"></div></div></header>


header {
        width: 200vw;
        max-height: 100vh ;
    }


.container{
        display: flex;
        max-height:100vh;
        flex-direction: column;
        flex-wrap: wrap;
        align-content:flex-start;
}



.item1 {
    background-color: red;
    height: 200px;
    flex: 1 0 150px;
}


.item2 { 
    background-color: blue;
    height: 200px;
    flex: 1 0 150px;

}


.item3 { 
    background-color: orange;
    height: 200px;
    flex: 1 0 150px;

}
Run Code Online (Sandbox Code Playgroud)

css3 flexbox css-animations

8
推荐指数
2
解决办法
5458
查看次数

标签 统计

css-animations ×1

css3 ×1

flexbox ×1