If the background is not a solid color, you need to split the folding page into rectangular strips and folding triangles. This can also be achieved through pseudo-classes. It is only provided for reference. The specific implementation needs to be modified as needed.
This can be achieved through the pseudo-class border-color.
HTML
CSS
If the background is not a solid color, you need to split the folding page into rectangular strips and folding triangles. This can also be achieved through pseudo-classes.
It is only provided for reference. The specific implementation needs to be modified as needed.
HTML
CSS
You can use Baidu to search for CSS3 corners
I implemented it by using three p's. A square p includes two triangle p's, and then it is positioned by position. . .
hover.css http://ianlunn.github.io/Hover/ has this effect, the corner is folded using gradient color
Other ideas can be to use border-width to simulate a triangle and then position it there