-2

チュートリアルを見た後、css3 を使用して Windows 8 のようなアニメーションを作成しようとしています。問題を示すために、背景を赤に設定しました。テキストではなく、青いブロック全体を垂直方向に反転したい。トップブロックのみお願いしております。

ここに画像の説明を入力

ここに画像の説明を入力

これらの赤い前面と背面のコード スニペットは次のとおりです。

 .front, .back {
      -webkit-backface-visibility: hidden;
      -moz-backface-visibility: hidden;
      backface-visibility: hidden;

      position: relative;
      display:block;
      background-color:red;
      top: 0;
      left: 0;
    }

ここに完全なフィドルがあります

4

2 に答える 2

-1

上のブロックを「反転」させたい場合は、HTML マークアップを「再構築」する必要があります。実際には、青いボックスの中にあるものを反転するように (コードで) 要求しています。

flip-container と flipper は、トリガー クラスです。

トリガー クラスを適切なコンテナーに追加して、青いボックスを反転するように (コードで) 指示するだけです。

<div class="col1 clearfix flip-container vertical">
    <div class="big todos-thumb flipper">
        ...

そして..これはcssとは何の関係もありません。

于 2013-08-01T17:20:15.240 に答える