002-CSS-三角形

普通三角形

💡 Tips：设置 div 盒子宽高为零，使用单边框实现

.triangle {
   
  width: 0;
  height: 0;
  border: 20px solid transparent;
  border-top-color: #ccc;
}

带阴影的三角形：box-shadow

💡 Tips：在普通三角形基础上，添加 box-shadow ，设置阴影方向、偏移量，搭配伪元素遮挡 实现

.tips-add-shadow {
   
  width: 300px;
  height: 200px;
  border-radius: 4px;
  background: #fff;
  box-shadow: 2px 2px 20px #ccc;
  margin-left