使用 CSS 偽元素:before & :after 製作「三角形」icon

在切版中，常常會有需要用到「三角形」的小icon，每次都要切圖也很麻煩，此時可以利用CSS的偽元素來產生，樣式有點醜，再自行調整吧。

語法如下：

a:after{
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-left-color: red;
}

若要產生底下這個樣式：

a:after, a:before{

        content: '';

        display: inline-block;

        position: absolute;

        top: 0;

        right: 0;

        width: 0;

        height: 0;

        border-radius: 10px;

        border: 10px solid transparent;

        border-left-color: red;

    }

    a:after{

        margin-right: 5px;

        border-left-color: white;

    }

即利用圓角和重壘的方式來呈現想要的結果。