週末はレストランやコンビニのお菓子のことを書いています。この広告は、90日以上更新していないブログに表示しています。part2CSS3今回は、CSS3の「transform」について書きます。以前に、transformの「拡大・縮小(transform:scale)」と「移動(transform:translate)」を書きました。今回は、「回転」,「傾斜」,「遠近効果」について書きます。「回転」などを書く前に、「transform」を軽く説明します。「transform」は、要素を拡大,回転,移動など色々変形させる事ができます。はじめに「回転」から書いていきます。「回転」は、名前の通り要素を回転させることができます。(※「webkit」などのベンダープレフィックスは適宜つけてください。)「-35deg」といったマイナスも指定できます。実際のプログラムでやるとこんなかんじです。200px;」の普通のやつです。青色が回転させたものです。比較のために上のプログラムとは、少し違います。/*3.Z軸を軸として回転します*/-webkit-transform:rotateZ(-125deg);こういう細かい指定もできます。)」について書いていきます。)」は要素を傾けることができます。*/(※「webkit」などのベンダープレフィックスは適宜つけてください。)第1引数はX軸の傾斜角度,、第2引数はY軸の傾斜角度となっています。マイナスの値も大丈夫です。いう細かい指定もできます。実際のプログラムで使うと、こうなります。id="nya"></div></body></html>最後に、「遠近効果」について書きます。遠近効果は、奥行きの深さを指定し、遠近効果を調整するものです。*/(※「webkit」などのベンダープレフィックスは適宜つけてください。)実際のプログラムで使うとこんなかんじです。id="nya"></div></div></body></html>緑にperspectiveを使っています。