トップ・ページの表示 注意書きの表示 掲示板に書き込む前に必ず この ”注意書き”を お読み下さい.

"T3T"掲示板(Twilight(トワイライト) Triath(トライアス)(3) Trim(トリム))

★この掲示板は書き込みを停止いたしました 。
記事の書き込みはリンク・ページの表示 http://ashtarte.hotcom-web.com/utf8/smt.cgi?r+rpr/ を ご利用 下さい。

   
   

ページの表示順:{ 新しい順/ 古い順}.
初期・ページの表示・位置:{ 先頭ページ/ 末尾ページ}.
1ページ内のスレッド表示数:







<Number>: [00000304]  <Date>: 2022/05/05 10:18:30
<Title>: CSSデモ/「transition、transform、rotateY 3D」001
<Name>: amanojaku@管理人

マウスカーソルをテキストにhoverすると(3D的に)Y軸で360度 回転する。

実際のページ
http://xd305417.html.xdomain.jp/demo/CSS_RotateY3D_001.htm


<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width">
  <title></title>
  <style>
    .Container {
      display: flex;
      justify-content: center;
    }

    .Sstage3D {
      display: inline-block;
      perspective: 15vw;
    }

    .Transform_Rotate3D {
      display: inline-block;
      transform: rotateY(0deg);
      transition: transform 5s linear
    }

    .Sstage3D:hover>.Transform_Rotate3D {
      transform: rotateY(360deg);
    }

  </style>
</head>
<body>
  <br>
  <div class="Container">
    <div class="Sstage3D">
      <div class="Transform_Rotate3D">
        QWERTY QWERTY QWERTY
      </div>
    </div>
  </div>
</body>
</html>

Block( Address 00000327 Identity 00000304 )






ページの表示順:{ 新しい順/ 古い順}.
初期・ページの表示・位置:{ 先頭ページ/ 末尾ページ}.
1ページ内のスレッド表示数:

   
   

管理者用 Password:

  




SMT Version 8.022(+A) Release M6.
Author : amanojaku.