原理：使用css3中的transform：rotate旋轉，通過定位改變位置。

.out{
            width: 300px;
            height: 150px;
            background-color: pink;
            margin:200px;
            position: relative;
        }

        .out::before{
            content:"";
            position: absolute;
            width: 50
 
px;
            height: 50px;
            background-color: pink;
            transform:rotate(45deg);
            left:40%;
            top:-15px;

        }
         <div class="out">
         </div>

效果圖：

根據自己的需求改變left top bottom right的值可以實現小三角的位置。