CSS3：transformで変形させる。

CSS3からの transform プロパティを使うことで様々な変形加工をすることができます。
IEの対応状況はお察し。

CSS

.box {
  margin:20px; background:#ccc; width:100px; padding:40px 10px; text-align:center;
}
// transform:translate 移動する
.translate100 {
  transform:translate(100px,0);
  -webkit-transform:translate(100px,0);
}
// transform:rotate 回転する
.rotate15 {
  transform:rotate(15deg);
  -webkit-transform:rotate(15deg);
}
// transform:scale 拡大・縮小する
.scale05 {
  transform:scale(0.5,0.5);
  -webkit-transform:scale(0.5,0.5);
}
// transform:skew 傾斜変形させる
.skew30 {
  transform:skew(30deg,0);
  -webkit-transform:skew(30deg,0);
}

下記にそのまま例を表示します。
transition、animation と組み合わせることでダイナミックな変形も可能です。