用CSS设计三角形图标

实现后如下图所示
三角图标
这个设计的原理很简单

  • 1,就是给一个块级标签的宽和高都设置为0,如果你要用行级标签,先设置行级标签的display为block后,就可以设置宽和高都为0。(本次演示使用i标签)
i{
   
display:block;
}
  • 2,接下来是设置border边框,设置border边框具有一定的宽度,这样就能依靠边框自己膨胀成一个矩形的模样
i{
   
    display:block;
    

你可能感兴趣的:(前端_CSS3,前端作品大集合,css3,html5,前端)