用css3做一个三角形

时间：2021-08-17 15:12:58 收藏：0 阅读：20

用css3做一个三角形

<style>
		.up {
			width: 0;
			height: 0;
			border-width: 0 30px 30px;
			border-style: solid;
			border-color: transparent transparent cyan;
			margin-top: 10px;
		}
		.down {
			width: 0;
			height: 0;
			border-width: 30px 30px 0;
			border-style: solid;
			border-color: cyan transparent transparent transparent;
			margin-top: 10px;
		}
		.left {
			width: 0;
			height: 0;
			border-width: 30px 30px 30px 0;
			border-style: solid;
			border-color: transparent cyan transparent;
			margin-top: 10px;
		}
		.right {
			width: 0;
			height: 0;
			border-width: 30px 0 30px 30px;
			border-style: solid;
			border-color: transparent cyan transparent;
			margin-top: 10px;
		}
	</style>
<body>
	<div class="up"></div>
	<div class="down"></div>
	<div class="left"></div>
	<div class="right"></div>
</body>

结果如下
技术分享图片

原文：https://www.cnblogs.com/yuhuo123/p/15151560.html