微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

万恶的广告幕布

上图

 上代码

<!DOCTYPE html>
<html>
    <head>
        <Meta charset="utf-8">
        <title></title>
    </head>
    <body>
        
        
        
        <div class="w">
            <div class="Box">
                日进斗金的大广告日进斗金的大广告
                日进斗金的大广告
                日进斗金的大广告
                </div>
            </div>
    
        <style>
            .w{
                width: 800px;
                height: 100px;
                background-color: black;
                margin: 100px auto;
                overflow: hidden;
            }
            .Box{
                height: 100px;
                position:relative;   
                color: red;
                right: 525px;
                line-height: 100px;
                
            animation:    Box 15s linear
                }
            @keyframes Box {
              from {right: -800px;}
              to {right: 525px;}
            }
            
        </style>
           </body>
</html>

复制粘贴就能用

核心代码

    animation:    Box 15s linear
                
            @keyframes Box {
              from {right: -800px;}
              to {right: 525px;}
            }

这里的Box是class名,要是要修改或者加的话注意就行

希望有帮助到你

原文地址:https://www.jb51.cc/wenti/3283978.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐