<style>
    @keyframes dh {
        from{
            margin-left: 0;
        }
        to{
            margin-left: -150%;
        }
    }
    #dh{
        display: flex;overflow: hidden;
    }
    #dh div{
        flex: none;width: 50%;height: 200px;text-align: center;font-size: 50px;background: #eeeeee;
    }
    /*大屏*/
    #dh div:nth-child(1){
        animation:dh 20s linear infinite;
    }
    #dh:hover div:nth-child(1){
        animation-play-state: paused;
    }
    /*中屏*/
    @media (max-width: 1500px) {
        #dh div:nth-child(1){
           animation-duration: 10s;
        }
    }
    /*小屏*/
    @media (max-width: 600px) {
        #dh div:nth-child(1){
            animation-duration: 5s;
        }
    }
</style>
<div id="dh">
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>1</div>
    <div>2</div>
    <div>3</div>
</div>