div+css写三角形

三角形

 
 
 
 
  
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>三角形</title>
	<style>
*{padding:0;}
#div1{width:0;height:0;border-right:50px solid transparent;border-left:50px solid transparent;border-top:100px solid red;}
#div2{width:0;height:0;border-right:50px solid transparent;border-left:50px solid transparent;border-bottom:100px solid red;}
#div3{width:0;height:0;border-top:50px solid transparent;border-bottom:50px solid transparent;border-right:100px solid red;}
#div3{width:0;height:0;border-top:50px solid transparent;border-bottom:50px solid transparent;border-left:100px solid red;}
#div4{width:0;height:0;border-right:500px solid transparent; border-top:200px solid red;}
</style>
</head>
<body>
	<div id="div1"></div>
	<div id="div2"></div>
	<div id="div3"></div>
	<div id="div4"></div>
	<div id="div5"></div>
</body>
</html>

　　

posted @ 2017-01-09 14:39  大汤汤  阅读(221)  评论(0)    收藏  举报