<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
* {margin: 50px auto;}
/* 上 */
.san_shang {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid #ff0066;
}
/* 下 */
.san_xia {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid red;
}
/* 左 */
.san_zuo {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid #333;
}
/* 右 */
.san_you {
width: 0;
height: 0;
border-top: 50px solid transparent;
border-right: 100px solid #0066ff;
border-bottom: 50px solid transparent;
}
</style>
</head>
<body>
<!-- 上 -->
<div class="san_shang"></div>
<!-- 下 -->
<div class="san_xia"></div>
<!-- 左 -->
<div class="san_zuo"></div>
<!-- 右 -->
<div class="san_you"></div>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
