CSS Triangles: A Tragedy in Five Acts
As alex said, borders of equal width butt up against each other at 45 degree angles:
![borders meet at 45 degree angles, content in middle](https://i.stack.imgur.com/hZefy.png)
When you have no top border, it looks like this:
![no top border](https://i.stack.imgur.com/uV9Q5.png)
Then you give it a width of 0...
![no width](https://i.stack.imgur.com/K1A7G.png)
...and a height of 0...
![no height either](https://i.stack.imgur.com/NsmsW.png)
...and finally, you make the two side borders transparent:
![transparent side borders](https://i.stack.imgur.com/B42zY.png)
That results in a triangle.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…