CSS 折角效果

<style type="text/css">
        .div1 {
            width: 200px;
            height: 200px;
            background-color: #ff6a00;
            border-width: 6px;
            margin: 0 auto;
        }


            

        .div2 {
            position: relative;
            width: 0;
            height: 0;
            border: 20px solid black;
            border-color:transparent  #ffd800 #ffd800 transparent ;
            background-color:#fff;
            font-size:xx-small;
            text-align:left;
        }
    </style>

  <div class="div1">
        <div class="div2">
            折角
        </div>
    </div>