Динамический фон страницы через CSS

В CSS3 доступна функция animation, позволяющая, например, динамически менять цвет элемента. Раньше это было возможно только используя JavaScript.








На примере динамической смены цвета фона сайта www.salon-praga.ru

body {
    height: 100%;
    animation: animated_color 20s infinite;
}

@keyframes animated_color {
    0% {
        background-color: #523e38
    }
    25% {
        background-color: #663366
    }
    50% {
        background-color: #383e52
    }
    75% {
        background-color: #523e38
    }
 100% {
        background-color: #663333
    }
}

animated_color- имя элемента @keyframes.
20s - продолжительность анимации.
infinite - циклическое повторение.
Keyframes - один из способов задания набора свойств и их значений при различных состояниях анимации.

Поддержка браузерами: