ホームページ  >  記事  >  ウェブフロントエンド  >  css3 フリップと回転の違い_html/css_WEB-ITnose

css3 フリップと回転の違い_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:18:431199ブラウズ

回転は反転と同じだと思っていましたが、今日、長時間回転させてみて、反転とは少し違うことに気づきました。私の三次元感覚の悪さを責めるだけです。 CSS3 の 3TRANSFORM には、回転、縮小、傾き、平行移動の機能があります。対応する属性は、Rotate、Scale、Skew、Translate

: (Rotate)

-webkit-transform:rotate(10deg);  -moz-transform:rotate(10deg);  transform:rotate(10deg);  /* 何问起 hovertree.com */
E

(この属性はズーム機能です。反転できますか? 括弧内の (1, 1) は X 軸を表し、後者は 1 より大きい場合に拡大されます。 0 より大きく 1 より小さい場合は減少します。負の数値は反転を表します)

水平反転:

-webkit-transform:scale(-1,1);  -moz-transform:scale(-1,1);  transform:scale(-1,1);  /* 何问起 hovertree.com */

垂直反転:

-webkit-transform:scale(1,-1);  -moz-transform:scale(1,-1);  transform:scale(1,-1);/* 何问起 hovertree.com */  

オンライン例: http://hovertree.com/code/ css/css3dxuanzhuan.htm

特殊効果:

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。