CSS 实现角标效果

CSS 实现角标效果

摘要

1. 自适应尺寸的尽量用 CSS 实现
2. 三角的实现推荐 clip-path，更容易理解
3. 充分考虑实现的可维护性，比如能用一个变量，就不要用两个变量，CSS 同样如此
4. 叠加一层半透明的黑色可以实现图像变暗
5. 图像变暗还可以通过 CSS 滤镜 brightness 实现
6. 未来还可以通过颜色混合 color-mix 来实现，可以提前了解一下
7. 背景混合模式可以让颜色叠加根据自然