下面小编就为大家带来一篇纯css实现三角的简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧

在很多页面制作中会设计到突出一个三角，下面给出一种兼容各种浏览器的设计方法： XML/HTML Code复制内容到剪贴板                                         .corner-top{                

一、前言 利用CSS的border属性可以生成一些图形，例如三角或是圆角。纯粹的CSS2的内容，没有兼容性的问题，我之前在纯CSS实现各类气球泡泡对话框效果一文中算是比较详细的讲述了CSS border属性生成三角的原理，以及实例。我觉得此技术相当实用的，故本文再次简单叙述一下，另外，本文还将展示可能并不为众人所知的CSS border圆角生成技术。好了，裹脚布的话就不说了，直接进入正题。 二、CSS border生成三角技术简介 效果抢鲜下图为使用CSS的border属性实现的三角效果： 复制