css写一个三角形

昨天面试了一个听起来很简单的问题，但是真的很久没有用到了，所以我都搞忘记了如何实现，哎，万万不可忘记很多基础的东西啊，说不定哪天就遇到了！。。

<div class="triangle"></div>
<style>
	.triangle{
	width:0;
	height:0;
	border-top:60px solid blue;
	border-bottom:60px solid red;
	border-left:60px solid yellow;
	border-right:60px solid green;
}
</style>

<div class="triangle"></div>
<style>
.triangle{
	width:0;
	height:0;
	border-top:60px solid transparent;
	border-bottom:60px solid red;
	border-left:60px solid transparent;
	border-right:60px solid transparent;
}	
</style>

<div class="triangle"></div>
<style>
 .triangle{
  	height:0px;
	width:0px;
	border-top:solid 100px rgb(55, 0, 255);
	border-left:solid 100px rgb(128, 0, 79);
}
</style>

<div class="triangle"></div>
<style>
.triangle{
	height:0px;
	width:0px;
	border-top:solid 100px transparent;
	border-left:solid 100px rgb(55, 0, 255);
}
</style>