参考文章：https://www.jianshu.com/p/da55d3bb3a7f https://blog.csdn.net/weixin_45849112/article/details/109236966

<style>
        #demo {
        position: relative;
        left:400px;
        width: 74px;
        height: 28px;
        border: 1px solid #D7D7D7;
        background:#fff
    }
#demo::before {
    position: absolute;
    left: 100%;
    width: 0px;
    height: 0px;
    content: &quot;&quot;;
    top: 7px;
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #D7D7D7;
}
#demo::after {
    position: absolute;
    left: 100%;
    width: 0px;
    height: 0px;
    content: &quot;&quot;;
    top: 8px;
    border-top: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 4px solid white;
}
&lt;/style&gt;
&lt;div id=&quot;demo&quot;&gt;

&lt;/div&gt;</code></pre>