傾斜を指定する

書式

transform : skew(傾斜角度)
transform : skew(横の傾斜角度, 縦の傾斜角度)
transform : skewX(横の傾斜角度)
transform : skewY(縦の傾斜角度)

説明

傾斜を指定するにはtransformプロパティにskew()を指定します。パラメータが1つの場合は横だけが指定された傾斜になります。2つパラメータを指定した場合は、最初のパラメータが横方向の傾斜、2番目のパラメータが縦方向の傾斜になります。
また、skewX()を指定すると横方向だけの傾斜を、skewY()を指定すると縦方向だけの傾斜を指定することができます。
ブラウザによってはベンダープレフィックスを指定しないと動作しません。

サンプル サンプルを実行 サンプルをダウンロード

#content {
transform : skew(-20deg);
-webkit-transform : skew(-20deg);
-moz-transform : skew(-20deg);
-o-transform : skew(-20deg);
-ms-transform : skew(-20deg);
}
目次に戻る