CSS-三角形

 .content {

     width: 100px;

     height: 100px;

     padding: 0;

     background: orange;

     position: absolute;

     top: 200px;

     left: 200px;

 }

 .content:after {

     display: block; /* 很重要，不然会有多余的px，且top left等也不能对齐 */

     content: "";

     width: 0;

     height: 0;

     padding: 0;

     margin: 0;

     position: relative;

     top: -20px;

     left: 30px;

     border: 10px solid transparent; //关键-透明

     border-bottom: 10px solid orange; //关键-bottom-箭头向上，top-箭头向下（控制方向）

}