概要
cssプロパティのtransformの関数を複数指定する方法と注意点を紹介。用途・要件
- 要素に移動、縮尺、回転、傾斜などの変形を複数適用させる。
- 関数の記述順によって挙動が異なるので注意する。
検証ブラウザ
- Google Chrome(最新)
- Safari(最新)
- Firefox(最新)
- Microsoft Edge(最新)
- IE11
実装方法
参考サイト : https://developer.mozilla.org/ja/docs/Web/CSS/transformCSS
//各関数を半角で区切る
セレクタ {
transform: translate(-50%, -50%) rotateZ(45deg);
}
ローカル環境にコードを移設した際に動作しない場合はこちら。（トラブルシューティングページへ）
