<div id="skewX">X ekseni ile 30 derecelik açı oluştur</div>
<div id="skewY">Y ekseni ile 30 derecelik açı oluştur</div>
<div id="skew">X ekseni ile 30, Y ekseni ile -20 derecelik açı oluştur</div>
div {
    width:120px;
    height:80px;
    background-color:cornflowerblue;
    color:#fff;
    text-align: center;
    margin:20px;
    padding:10px;
    transition:transform 2s;
}

#skewX:hover{
    transform:skewX(30deg);
}

#skewY:hover{
    transform:skewY(30deg);
}

#skew:hover{
    transform:skew(30deg, -20deg);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.