首页 > Web开发 > 详细

58.用纯CSS创建一个三角形的原理是什么?

时间:2020-08-08 23:49:08      阅读:163      评论:0      收藏:0      [点我收藏+]
  • 采用的是均分原理,把矩形分为4等份,这4等份其实都是边框


     
    技术分享图片
    image.png
  • 实现方式,
    核心就是给块级元素设置宽高为0,设置边框的宽度,不需要显示的边框使用透明色;


     
    技术分享图片
    image.png
  • 使用场景
    使用场景一般都是做一些小图标,比如之前做的京东二维码
    上面这种做法就是用两个大小一样的三角形重叠在一起,下面的三角形背景色为绿色,
    上面的三角形为白色,用z-index改变层级;


作者:爱前端的喵喵
链接:https://www.jianshu.com/p/20052984544d
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

58.用纯CSS创建一个三角形的原理是什么?

原文:https://www.cnblogs.com/dream111/p/13461023.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!