Skip to content

Latest commit

 

History

History
56 lines (48 loc) · 1.37 KB

README.md

File metadata and controls

56 lines (48 loc) · 1.37 KB
Raw

css3

##背景动画 
<div class="bg">
        <div class="row1">
            <div class="c1"></div>
            <div class="c2"></div>
            <div class="c3"></div>
            <div class="c4"></div>
        </div>
        <div class="row2">
            <div class="c1"></div>
            <div class="c2"></div>
            <div class="c3"></div>
        </div>
        <div class="row3">
            <div class="c1"></div>
            <div class="c2"></div>
            <div class="c3"></div>
        </div>  
<div>

背景动画：近大远小，近慢远快

##cube动画

<div class="container">
        <div class="wrap">
            <div class="i">
                <div class="top"></div>
                <div class="bottom"></div>
                <div class="left"></div>
                <div class="right"></div>
                <div class="front"></div>
                <div class="back"></div>
            </div>
            <div class="o">
                <div class="top"></div>
                <div class="bottom"></div>
                <div class="left"></div>
                <div class="right"></div>
                <div class="front"></div>
                <div class="back"></div>
            </div>
        </div>
    </div>

子盒子参照父盒子定位，通过3d透视实现立体效果。然后让父子做动画。