用css画三角形、爱心、钻石

如何用css画出来爱心、钻石、多边形

首先得了解下盒子模型

content：内容。
padding：内边距。
border：边框。
margin：外边距。

利用boder的特点，可以给boder添加颜色，粗细，从而改变整体样式。
这个效果，是把border加粗，再填充颜色。下面的代码可以实现这个效果。

<div id="triangle"></div>

		#triangle{
   
	/*		margin: 0 auto;
			position: absolute;
			top: 50%;
			left: 50%;*/
			/*transform: translate(-50%, -50%);*/
			width: 50px;
			height: 50px;
			border-top: 50px solid red ;
			border-bottom: 50px solid yellow ;
			border-left: 50px solid blue ;
			border-right: 50px solid green ;
		}

大概来理解下，修改上面代码，把高宽置零，去掉一个border-bottom。

		#triangle{
   
	/*		margin: 0 auto;
			position: absolute;
			top: 50%;
			left: 50%;*/
			/*transform: translate(-50%, -50%);*/
			width