<!DOCTYPE?html>
<html>
<head>
<meta?charset="utf-8">
<title>變形與動畫</title>
<style>
.wrapper{
height:200px;
width:300px;
border:2px?dotted?red;
margin:100px?auto;
}
.wrapper?div{
????height:200px;
????width:300px;
????line-height:200px;
????text-align:center;
????background:green;
????color：#fff;
????transform:skew(-100deg);
????-webkit-transform:skew(-100deg);
????-moz-tansform:skew(-100deg);
}
.wrapper?span{
????display:block;
????
????background:yellow;
????transform:skew(60deg);
????-webkit-transform:skew(60deg);
????-moz-transform:skew(60deg);
}
?
</style>
</head>
<body>
<div?class="wrapper">
<div><span>我不想旋轉</span></div>
</div>
</body>
</html>
2016-10-21
90deg和270deg的時候正好是水平一條線上的狀態，所以就看不到了