DEMO
Thêm đoạn css dưới đây và thẻ
]]></b:skin>
* { padding: 0; margin: 0; list-style: none; } html,body { height: 100%; } .main { height: 100%; width: 100%; -webkit-background-size: cover; background-size: cover; overflow: hidden; position: relative; } .main ul { height: 100%; width: 3920px; position: absolute; top: 0; left: 0; animation: dong 50s linear infinite; } @keyframes dong { 0% { left: 0; } 100% { left: 1920px; } } .main ul li { height: 100%; width: 100%; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxU3C65s6juN4MvBMRf-DnAU7q_DYSemhEGc5R_wbthyphenhyphenPo-g6gn5OkqHti5S2iVLHBW5GgW3lM5aolLu4DhzUyfLgArp6vRHJjRb-qfvoZ3CcmFFtCiM53to1P4FfEF65JjSzYXue3ESo/s1600/2.jpg); float: left; margin-left: -2000px; } .wk { z-index: 999; width: 200px; height: 180px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwJO_wdZn2E3p8hPIFiW7lCPChgopThRyTwYd0rwEFmHv2-VrnbWJrRxnAV_2tdsiC9ar6B6LXtFN7fNlOrwzbWOqLXse-m4tvS_qm3AJWl0sGees9IUfytJOjb6pJE9Rb-bchVUqJkcQ/s1600/west_01_3ca39fe.png) 0 0 no-repeat; /*margin: 400px auto;*/ position: absolute; top: 55%; left: 20%; animation: wkzou 1s steps(8) infinite; } @keyframes wkzou { to { background-position: -1600px 0; } } .bj { z-index: 999; width: 200px; height: 180px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXSJVSuqlpbYjdwze8jrXtJA9IoJDQO_7-5LLHz2wgb_0_kTvsqGVIwJ8HnI39FOv-owoWsyvV3PifjLeZgxOXw5OXvuhfkZo2cxtKwwGkjEQAPX9VWAgkf8v2uwAq5JtDPlsZVdHgufA/s1600/west_02_47bad19.png) 0 0 no-repeat; /*margin: 400px auto;*/ position: absolute; top: 55%; left: 35%; animation: bjzou 1s steps(8) infinite; } @keyframes bjzou { to { background-position: -1600px 0; } } .ts { z-index: 999; width: 170px; height: 240px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyAmrO759JNZ9aFICiPuxW1IqxRk9bonJgxmu7RId2tjDEDp9_ueVeXjBJYukPbkzFG05aLnMLPGUnE6kOjlA0FMIR0oobo0ecyS4Ka-4v5ZPFddhnTPJJDbQv7KevuCvbAcJsBoBDIT4/s1600/west_03_f962447.png) 0 0 no-repeat; /*margin: 400px auto;*/ position: absolute; top: 50%; left: 50%; animation: tszou 1s steps(8) infinite; } @keyframes tszou { to { background-position: -1360px 0; } } .ss { z-index: 999; width: 210px; height: 200px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyzMtQkMXacS2ZAWbkLORrQXULreD_2NgrnjJ5fthG5MCivPK5ryx6oXxESQ1uxWWFIwncwx2Q-kHxsNTlK4wCyQctmQc8SxHPGDutyE-IpmVGfBku3kkXIFV-A_aBxm_HQ_zvAKPZvyA/s3200/west_04_6516d80.png) 0 0 no-repeat; /*margin: 400px auto;*/ position: absolute; top: 57%; left: 62%; animation: sszou 1s steps(8) infinite; } @keyframes sszou { to { background-position: -1680px 0; } }
Tiếp đó là đoạn code hiển thị:
<div class="wk"></div> <div class="bj"></div> <div class="ts"></div> <div class="ss"></div> <div class="main"> <ul> <li></li> <li></li> </ul> </div>
URL: https://www.zoyit.info/
Title : NHM IT
Link : www.nhmcntt.tk
Mình đã đặt liên kết của bn