rotateZ(10deg);}6つのdivをabsoluteします。(いったん1つに重ねる。)見えなくなるのでopacityで透過する。div{position:absolute;opacity:0.5;}以下のように指定します。roteteで回転させ。top,bottom,left,rightで位置をあわせます。回転させる際に文字が読めるようにする。rotateY(180deg);}最後にhoverの指定です。containerをhoverしたら、contentがどうなるか指定。0.5turnは半回転、1turnなら1回転。rotateZ(20deg)ならz軸を中心に20度回転する。-20degなら20度逆回転する。ちなみにデフォルトの回転の基準点は真ん中だけど、transform-originで基準点を変えられます。rotateZ(20deg);}早さの指定です。3sは3秒かけてhoverの指定が行われるという事です。div{transition:3s;}全部のcssは以下の通りです。rotateY(180deg);}立体について分からない人はこちらも参考にして下さい。→ksk先生作成の参考ファイル(わかりやすいです。)アレンジバージョン1(画像を入れてみました。meアレンジバージョン2(奥行き感をだしました。)perspective:300px;を大外の#containerに追加しただけです。pxの数値が小さいほど奥行き感は増します。