背景を斜めにする

Result

親要素を回転させ、子要素を逆回転で元に戻してます

css

div{
  height:300px;
  background:#333;
  transform: rotate(-10deg);/*親要素を斜めにする*/
  position:relative;
  top:-150px;
  left:-100px;
  width:1500px;
}
p{
  padding-top:200px;
  color:#fff;
  width:50%;
  margin:auto;
  font-size:3em;
   transform: rotate(10deg);/*子要素だけ戻す*/
  }

html

<div>
<p>foo</p>
</div>

via

none