css中需要更小的字體如何實現

我想有很度人都遇到過這種問題，因為瀏覽器對font-size的最小值有所限制，例如Chrome,當我取值為10以下時，沒有任何變化，直到0時文字消失不見，負值時回到字體原本的樣子，所以我整理了一下瀏覽器對取值的限制以及解決方法

我遇到的是更小字體的解決方法，所以以我為例

.span1{
    display: inline-block;
    width: 37px;
    height: 12px;
    border: 1px solid #E58A85;
    color: #E58A85;
    font-size: xx-small;
}
<p>
        <span class="span1">用券減40

 　　 <span class="span2">JBL T120A立體式入耳式耳機手機音樂耳機 游戲耳機 耳機耳麥 帶麥......</span>                                            
        </span>
        <span class="span3">￥128</span>


</p>        
    

當然，我們可以使用縮放來實現

.span1{
    display: block;
    width: 37px;
    height: 12px;
    border: 1px solid #E58A85;
    color: #E58A85;
    transform: scale(0.5);
}