快速解决css使用@keyframes加载图片首次循环时出现白色间隙问题(闪屏)详解CSS 去掉inline-block元素间隙的几种方法 CSS图片下面有间隙的6种解决方案css几种解决inline-block间隙的方案(整理)css解决display:inline-block;产生的缝隙（间隙）的方法详解CSS清除图片下几像素空白间隙的方法

 //html 
 //less .container { width: 100vw; height: 100%; } .container .first { width: 100vw; height: 100vh; animation: bgmove 10s infinite; } @keyframes bgmove { 0% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1.jpg") no-repeat center center; background-size: cover; opacity: 1; } 15% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 30% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-2_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 45% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-4_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 60% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-5_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 80% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 100% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1.jpg") no-repeat center center; background-size: cover; opacity: 1; } }

 //less .container { width: 100vw; height: 100%; } .container .first { width: 100vw; height: 100vh; background:url("https://sqimg.qq.com/qq\_product\_operations/im/pcqq/9.0/firstscreen\_img/BG-1.jpg"), url("https://sqimg.qq.com/qq\_product\_operations/im/pcqq/9.0/firstscreen\_img/BG-1\_1.jpg"), url("https://sqimg.qq.com/qq\_product\_operations/im/pcqq/9.0/firstscreen\_img/BG-2\_1.jpg"), url("https://sqimg.qq.com/qq\_product\_operations/im/pcqq/9.0/firstscreen\_img/BG-4\_1.jpg"), url("https://sqimg.qq.com/qq\_product\_operations/im/pcqq/9.0/firstscreen\_img/BG-5\_1.jpg"), url("https://sqimg.qq.com/qq\_product\_operations/im/pcqq/9.0/firstscreen\_img/BG-1\_1.jpg"); animation: bgmove 10s infinite; } @keyframes bgmove { 0% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1.jpg") no-repeat center center; background-size: cover; opacity: 1; } 15% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 30% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-2_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 45% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-4_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 60% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-5_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 80% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1_1.jpg") no-repeat center center; opacity: 1; background-size: cover; } 100% { background: url("https://sqimg.qq.com/qq_product_operations/im/pcqq/9.0/firstscreen_img/BG-1.jpg") no-repeat center center; background-size: cover; opacity: 1; } }