怎么用css设置字体小于12px

因为浏览器的限制，网页上的字体最下只能设置12px，因为小于12px就会影响浏览效果
但是有时候我们需要将字体设置的很小这就需要用到特殊的手段
用 transform属性设置
用 transform的scale缩放属性将字体缩放，实际上并没有改变字体大小，只是将标签缩放了，这样看起来就小了很多
代码如下：
1、移动端

<style>
        .font {
            /* 10px / 12px = 0.83 */
            font-size: 12px;
            line-height: 36px;
            /* transform: scale(0.83); */
            transform: scale(calc(10 / 12));
        }
    </style>
    <p class='font'>hello world！ 你好，世界！</p>

2、PC端
 避免不支持 css3 浏览器的情况，我们也可以通过降级处理，将字体变回12px；最后兼容 IE：*font-size:10px;

 <style>
        .font {
            font-size: 12px;
            /* transform: scale(0.83); */
            transform: scale(calc(10 / 12));
            *font-size: 10px;
        }
    </style>
    <p class='font'>hello world！ 你好，世界！</p>