2D：平面空間での要素の変形

2D：平面空間での要素変換

変換属性：
変換：その属性値は関数関数であり、スペースを占有します。

• 2D機能機能
  2D変位
  2D回転
  2Dズーム
  2Dチルト

• 2D変位：
  変換：変換（x、y）;
  変換：変換X（x軸によって移動された距離）;
  変換：変換Y（y軸によって移動された距離）;

• 2Dスケーリング：
  変換：スケール（X、Y）を、
  これら2つの数のX、Yパラメータが1より大きい狭めるために拡大、反している
  変換：scaleXプロパティ（）;
  変換：scaleYの（）。

• 2D回転：
  変換：回転（10度）
  、正の数が時計回りの単方向回転もサポート

• 2Dチルト：
  変換：スキュー（20度）;
  一方向チルトをサポートします。

 transform: translate(20px,30px) rotate(270deg) scale(2) ;
 /*可一属性多属性值，中间用空格隔开*/

複数の関数関数を一緒に使用する場合は、最初に変位を記述してから、他の関数関数を記述して、変位に対する他の関数の影響を回避してください。

• 
  変換の原点を変更します：transform-origin：xy;
  属性値：左上、右下、中央px％

 transform-origin: left bottom;/*以左下角为定点变形*/

• ターゲットの疑似クラスセレクター：
  エレメントセレクター：ターゲット{
  //エレメントが関連するURLによってポイントされている場合、スタイルを変更します。}

  div{
            width: 300px;
            height: 0;
            background: rosybrown;
            text-align: center;
            line-height: 200px;
            color: #fff;
            font-size: 50px;
            font-weight: 600;
            margin: 0 auto;
            overflow: hidden;
            transition: 1s;
        }
        div:target{
            height: 200px;
        }/*点击后，高从0变到200px*/