css i 倾斜如何做到,CSS3变形倾斜一面

尝试这个：

要取消选择图像,请使用图像的嵌套div,并给出相反的斜率值.所以如果你的父母有20deg,你可以给嵌套(图像)div一个-20deg的偏移值.

.container {

overflow: hidden;

}

#parallelogram {

width: 150px;

height: 100px;

margin: 0 0 0 -20px;

-webkit-transform: skew(20deg);

-moz-transform: skew(20deg);

-o-transform: skew(20deg);

background: red;

overflow: hidden;

position: relative;

}

.image {

background: url(http://placekitten.com/301/301);

position: absolute;

top: -30px;

left: -30px;

right: -30px;

bottom: -30px;

-webkit-transform: skew(-20deg);

-moz-transform: skew(-20deg);

-o-transform: skew(-20deg);

}

例子：