前端浏览器字体小于12px怎么办

=1" class="cartData">
     =1&&cartNum<=99">{{cartNum}}

css部分：
 

.cartData{
    height: .75rem;
    min-width: .75rem;
    border-radius: .375rem;
    background: red;
    color: white;
    text-align: center;
    line-height: .75rem;
  }
  .Num{
    font-size: 20px;
    -webkit-transform: scale(0.5);
    }

上面字体就14*0.8 = 11.2px,可以根据需求做具体调整。

只这样写可不会兼容IE、FF哦，所以再给一个兼容性写法：

.Num{
    font-size: 14px;
    -webkit-transform: scale(0.8);
 }
.Numsize-font{
  font-size: 14*0.8px;
}

注意:

transform:scale()这个属性只可以缩放可以定义宽高的元素，而行内元素是没有宽高的，我们可以加上一个display:inline-block;

关于“前端浏览器字体小于12px怎么办”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。