建站技术分享网

<style type="text/css">

.site-logo{

  position: relative;

  overflow: hidden;

  float:left;

  max-height: 50px;

}

.site-logo:before {

    content: "";

    position: absolute;

    width: 150px;

    height: 15px;

    background-color: rgba(255, 255, 255, 0.5);

    -webkit-transform: rotate(-45deg);

    transform: rotate(-45deg);

    -webkit-animation: blink 2s ease-in 2s infinite;

    animation: blink 2s ease-in 2s infinite;

}
@-webkit-keyframes blink {

    from {left: 10px;top: 0;}

    to {left: 320px;top: 0;}

}

@-o-keyframes blink {

    from {left: 10px;top: 0;}

    to {left: 320px;top: 0;}

}

@-moz-keyframes blink {

    from {left: 10px;top: 0;}

    to {left: 320px;top: 0;}

}

@keyframes blink {

    from {left: -100px;top: 0;}

    to {left: 320px;top: 0;}

}

</style>

<div class="site-logo"><img src="https://blog.feiba.cn/content/templates/Fys/images/logo.png"></div>