本文通过三种方法给大家介绍了基于css实现的页面的尖角、小三角、不同方向尖角效果，代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友参考下吧,需要的朋友可以参考下

效果图： 方法一的效果图： 方法二的效果图： 方法三的效果图： 方法1：因为有背景，所有实现起来比较方便，尖角的内部同个颜色就可以不用考虑遮挡问题 html: 带背景颜色的小三角实现是比较简单的！ css #top { position: absolute; width: 0px; height: 0px; line-height: 0px;/*为了防止ie下出现题型*/ border-bottom: 10px solid #8