<!Doctype html>
<html>
<head>
<title>Слайдер изображений</title>
<style>
body {
margin:10px auto;
text-align:center;
}
.content {
max-width:800px;
text-align:left;
margin:auto;
}
.simple-ss {
width:800px;
height:250px;
background-color: #eeeeee;
margin:auto;
background-image:url("https://imgur.com/download/OtK7XDW");
animation-name: slide;
animation-duration: 10s;
animation-direction: normal;
animation-timing-function: ease;
animation-iteration-count: infinite;
}
@keyframes slide {
0% {background-position:0 0;}
16.66% {background-position:0 0;}
33.32% {background-position:-800px 0;}
49.98% {background-position:-800px 0;}
66.64% {background-position:-1600px 0;}
83.30% {background-position:-1600px 0;}
100% {background-position:0 0;}
}
</style>