css怎么制作一个三角形

这篇文章主要讲解了“css怎么制作一个三角形”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“css怎么制作一个三角形”吧！

成都创新互联自2013年创立以来，先为山南等服务建站，山南等地企业，进行企业商务咨询服务。为山南企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

在很多页面制作中会设计到突出一个三角，下面给出一种兼容各种浏览器的设计方法：

XML/HTML Code复制内容到剪贴板

1.   

2.   

3.   

4.       

5.       

6.         

7.         .corner-top{   

8.             width:0px;    

9.             height:0px;   

10.             font-size:0;               

11.             border-width:20px;     

12.             border-style:solid dashed dashed dashed;     

13.             border-color:#e66161 transparent transparent transparent;   

14.         }   

15.         .corner-bottom{   

16.             width:0px;    

17.             height:0px;   

18.             font-size:0;               

19.             border-width:20px;     

20.             border-style:dashed dashed solid dashed;     

21.             border-color:transparent transparent #94e24f transparent;   

22.         }   

23.         .corner-left{   

24.             width:0px;    

25.             height:0px;   

26.             font-size:0;               

27.             border-width:20px;     

28.             border-style:dashed dashed dashed solid;     

29.             border-color:transparent transparent transparent #85bfda;   

30.         }   

31.         .corner-right{   

32.             width:0px;    

33.             height:0px;   

34.             font-size:0;               

35.             border-width:20px;     

36.             border-style:dashed solid dashed dashed;     

37.             border-color:transparent #f3bb5b transparent transparent;   

38.         }   

39.       

40.   

41.   

42.