插件Animate的引用

animate官网：

https://animate.style/

可以尝试各种动画效果

animate__animated到元素类中，以及任何动画名称（不要忘记animate__前缀！）

<div class="box">
        <div class="top">
            <!--animate__animated animate__  这是前缀 双下划线后面接动画属性   fadeInLeftBig表示从左边大幅度进入--!>
            <div class="t_left animate__animated animate__fadeInLeftBig">欢迎访问某某电子电器有限公司!</div>
                <!--animate__animated animate__  这是前缀 双下划线后面接动画属性   fadeInLeftBig表示从右边大幅度进入--!>
            <div class="t_right animate__animated animate__fadeInRightBig">    
               <div class="r_img"></div>
                <span>服务热线：</span>
                <span>400-0000-000</span>
            </div>
        </div>
        <div class="centent">
            <div class="c_left  animate__animated animate__fadeInLeftBig">
                <img src="img/logo.png" alt="">
                <span>某某电子电气公司</span>
            </div>
            <div class="c_right animate__animated animate__fadeInRightBig">
                <li>网站首页</li>
                <li>关于我们</li>
                <li>产品中心</li>
                <li>新闻资讯</li>
                <li>联系我们</li>
            </div>
        </div>
        <div class="bottom">
            <p class=" animate__animated animate__fadeInLeftBig">领先的电气电气制造企业</p>
            <p class=" animate__animated animate__fadeInRightBig">FHAKHFAGJKAGJKAGHKJFHBFAS</p>
            <p class=" animate__animated animate__fadeInLeftBig">专业电子电子制造服务</p>
            <p class=" animate__animated animate__fadeInRightBig">FSFHKJAFHAJKHF</p>
        </div>
    </div>

实现效果如下

 

 同时从窗口处进入设定盒子范围