CSS三角形&梯形&圆&0

border-left:50px solid transparent;

}

[](()梯形：

---

.ti{

height: 20px;

width: 60px;

border-top:0 solid transparent;

border-bottom:50px solid red;

border-right:50px solid transparent;

border 《大厂前端面试题解析+Web核心总结学习笔记+企业项目实战源码+最新高清讲解视频》无偿开源 徽信搜索公众号【编程进阶路】 -left:50px solid transparent;

}

[](()圆形：

---

.yuan{

height: 60px;

width: 60px;

border-radius:50%;

background-color: skyblue;

}

[](()0.5px的线：

---

• 不能直接height：0.5px，因为浏览器会把0.5四舍五入到1px

• 如果是边框可以设置伪元素缩放

.line{

height: 0.5px;

background-color: red;

color:tomato;

transform: scaleY(0.5);

}