旋转，rotate允许你通过传一个角度值来旋转一个元素。
如果设置的值为正数表示顺时针旋转，如果设置的值为负数，则表示逆时针旋转。
倾斜，skew可以将一个对象围绕着x和y轴按照一定的角度倾斜，在参数中分别指定水平方向上的倾斜角度与垂直方向上的倾斜角度。
"
把背景和文字分成两个不同的元素即可，比如：
<!doctype html><html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
div {
position:relative
}
span.bk {
display: block
width:120pxheight: 110px
background-color: chartreuse
transform:skewY(10deg)
transform:skewX(10deg)
}
span.ft {
position:absolute
left:30px top:30px
width:60pxheight:50px
line-height: 50px
align-self: center
}
</style>
</head>
<body>
<div>
<span class=bk></span>
<span class=ft>TEST</span>
</div>
</body>
</html>
