css3像卷轴一样展开

Question

请问如何让一个元素从中间开始向两边展开？像卷轴一样？

Answer 1

刚才想了下，最简单的使用position的left和right就能实现

.map{
    height:100px;
    background:url('https://sf-static.b0.upaiyun.com/v-5798d230/global/img/logo-b.svg') center center no-repeat;
    animation:spread 5s linear forwards;
    position:absolute;
    left:50%;
    right:50%;
    text-align:center;
}

@keyframes spread{
    form{}
    to{left:0;right:0;｝
}