Small CSS triangle

First, see Figure 1. effect:

The Code is as follows:

<Div style = "border-top: 10px solid # ffffcc; border-left: 10px solid # ff3300; border-bottom: 10px solid # ffffcc;"> </div>

The key is to know that the connection between the top, bottom, and left borders is a diagonal line, 2:

Then the figure 1 above is simple. The width of the top border is the height of the triangle, the border color is the same as the background color, and the bottom border is the same as above. The width of the left border is the same as that of the upper and lower border. The color is the triangle color, that is, Red.

ThisDemoIs a common triangle writing method.