div盒子的内三角的制作

Posted 勇敢*牛牛

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了div盒子的内三角的制作相关的知识,希望对你有一定的参考价值。

div盒子的内三角的制作


.advanteage-content
    top: 0.8rem;
    left: -0.2rem;
    &::before
      position: absolute;
      top: 0;
      left: -0.01rem;
      width: 0;
      height: 0;
      border-top: 0.4rem solid #F8F8FA;
      border-bottom: none;
      border-left: none;
      border-right: 0.4rem solid transparent;
      content: '';
    
    &::after
      position: absolute;
      bottom: 0;
      right: -0.01rem;
      width: 0;
      height: 0;
      border-top: none;
      border-bottom: 0.4rem solid #F8F8FA;
      border-left: 0.4rem solid transparent;
      border-right: none;
      content: '';
    
  

以上是关于div盒子的内三角的制作的主要内容,如果未能解决你的问题,请参考以下文章

基于HTML+CSS制作一个简单的家乡网页制作作业,广州介绍旅游网页设计代码 学生个人html静态网页制作成品代码

CSS三角形制作样式

前端基础

前端基础只是学习

使用CSS3制作三角形小图标

如何在不使用边框和图像的情况下在 div 上制作 CSS 三角形背景? [复制]