0
点赞
收藏
分享

微信扫一扫

【开发小技巧】022—CSS如何实现字体小于12px的效果

杰克逊爱学习 2022-12-01 阅读 122

【开发小技巧】022—CSS如何实现字体小于12px的效果_移动端

大家都知道设置font-size小于12px的时候,显示都为12px。

无法实现更小的字体了,但是面对UI图的时候出现小于10px的字体,第一想到的就是把字体直接作为图片放在到页面。

那么CSS能实现小于12px的字体吗?答案是:可以的!

1、移动端

1、移动端

.font{
// 10px / 12px = 0.83
transform: scale(0.83);
}

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

.font{
font-size: 12px;
transform: scale(0.83,0.83) ;
*font-size: 10px;
}

希望本文对你有所帮助。

本文完~


【开发小技巧】022—CSS如何实现字体小于12px的效果_css3_02

【开发小技巧】022—CSS如何实现字体小于12px的效果_css_03

举报

相关推荐

0 条评论