方法一：
<style type="text/css">
#css{ 300px; height:300px; background-color:#00F; transform:rotate(45deg); position:relative; margin:-200px 0px 0px 50px; z-index:1; padding:10px}
</style>
<body>
<div style="400px; height:200px; background-color:#FFF; overflow:hidden; margin-left:300px; margin-top:200px;">
<div id="css"></div>
</div>
</body>
这种是一个套在一个里面
方法二：
<style type="text/css">
.www{0px; height:0px; border-bottom:100px solid #FFF; border-left:100px solid #FFF; border-top:100px solid #00F; border-right:100px solid #FFF}
</style>
<body>
<div class="www"></div>
</body>
这个的方法与上文一样就不多赘述了。