1<!DOCTYPE HTML>
2<html>
3 <head>
4 <meta charset="utf-8">
5 <title>transform-origin</title>
6 <style>
7 div {
8 background: #fc0;
9 padding: 10px;
10 display: inline-block;
11 border: 1px solid #000;
12 }
13 div:hover {
14 /* Точка поворота в правом верхнем углу */
15 -webkit-transform-origin: 100% 0;
16 -moz-transform-origin: 100% 0;
17 -o-transform-origin: 100% 0;
18 -ms-transform-origin: 100% 0;
19 transform-origin: 100% 0;
20 /* Поворачиваем на 20 градусов против часовой стрелки */
21 -webkit-transform: rotate(-20deg);
22 -moz-transform: rotate(-20deg);
23 -o-transform: rotate(-20deg);
24 -ms-transform: rotate(-20deg);
25 transform: rotate(-20deg);
26 }
27 </style>
28 </head>
29 <body>
30 <div>Пример</div>
31 </body>
32</html>