Crucifix Arnaud

Animation

selector {
    animation: 
        duration
        easing-function
        delay
        iteration-count
        direction
        fill-mode
        play-state
        name
    ;
}

@keyframes name {
    from {
        property: value;
    }
    to {
        property: value;
    }
}

Examples:

Rotate

.rotate-1 {
    animation: rotate 2s infinite linear;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

Oscillate

.oscillate {
    animation: oscillate 2s infinite linear;
}

@keyframes oscillate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

Links