use the css transform property skewy to skew an element along the y axis - zilongxuan001/LearnFreecode GitHub Wiki
#使用CSStransform属性从Y轴方向扭曲一个元素
考虑到skewX()的功能可以在水平轴上扭曲元素，那么使用skewY()就能在垂直方向上扭曲元素。
使用transform属性，在Y轴上设置id为top的元素偏移角度为-10deg。
<style>
div {
width: 70%;
height: 100px;
margin: 50px auto;
}
#top {
background-color: red;
transform: skewY(-10deg);
}
#bottom {
background-color: blue;
transform: skewX(24deg);
}
</style>
<div id="top"></div>
<div id="bottom"></div>
2018-10-30 15:32:44