CSS3でふわふわ浮遊を実装する方法について紹介します。

ちなみにこうすると影がでるようになります。

@keyframes float {
    0% {
        box-shadow: 0 5px 15px 0px rgba(0,0,0,0.5);
        transform: translatey(0px);
    }
    50% {
        box-shadow: 0 25px 15px 0px rgba(0,0,0,0.0);
        transform: translatey(-20px);
    }
    100% {
        box-shadow: 0 5px 15px 0px rgba(0,0,0,0.5);
        transform: translatey(0px);
    }
}