如何用CSS3代码书写平行四边形

用css3的CSS3 transform 旋转的属性写出来，就是transform：skew。

代码如下：

<!Doctype html>

<html>

<head>

<title>用css3旋转写平行四边形</title>

.box{width:1200px;margin:100px auto;}

.skew{width:1000px;height:734px;background:#f0eb4f;margin:0 auto;color:#000;

font-size:20px;line-height:500px;text-align:center;transform: skew(-15deg);}

.skew-main{transform: skew(15deg);}

.box02 {

width: 0;

height: 0;

border-top: 100px solid #f44261;

border-right: 100px solid transparent;

}

</style>

</head>

<body>

<div class="skew"><div class="skew-main">用css3旋转写平行四边形</div></div>

</div>

</body>

</html>

如需转载，请注明文章出处和来源网址：http://www.divcss5.com/css3-style/c31687.shtml