此處為何要加入display:block;沒加上我的字體就扭曲不回來了
.wrapper2{
? ? ? ? margin:100px auto;
? ? ? ? width:300px;
? ? ? ? height:200px;
? ? ? ? border:2px dotted aqua;
? ? }
? ? .wrapper2 div{
? ? ? ? width:300px;
? ? ? ? height:200px;
? ? ? ? line-height:200px;
? ? ? ? text-align:center;
? ? ? ? background:pink;
? ? ? ? transform:skew(45deg,10deg);
? ? ? ? -webkit-transform:skew(45deg,10deg);
? ? ? ? -moz-transform:skew(45deg,10deg);
? ? }
? ? .wrapper2 span{
? ? ? ? display:block;
? ? ? ? transform:skew(-45deg,-10deg);
? ? ? ? -webkit-transform:skew(-45deg,-10deg);
? ? ? ? -moz-transform:skew(-45deg,-10deg);
? ? }
2017-08-16
display:block;
是讓對象成為塊級元素(比如a，span等)
display有很多對象，具體可以參考http://www.w3school.com.cn/css/pr_class_display.asp
一般都是用display:none和display:block來控制層的顯示