В этой серии мы будем строить полнофункциональный слайдер на HTML и CSS без применения JavaScript.

Как такое может быть? Может! Мы воспользуемся приёмом, который возможно встречался вам раньше в задании из части «Селекторы. Тонкости».

Но обо всём по порядку. Сначала нужно собрать разметку с картинками в нужном виде:

• картинки располагаются в ряд;
 
• у общего контейнера должно быть задано свойство overflow: hidden, скрывающее всё, кроме текущей видимой картинки;
• а ширина дочернего контейнера должна равняться суммарной ширине всех картинок внутри.

Поехали!