CSS - font-size 设置小字体不生效解决方案(小于12px)
2023-09-11 14:15:54 时间
前言
使用
font-size
设置小于12px
的字体时,发现并不生效(字体不会再缩小了)。
原因是 Chrome
以及 Chromium
内核的浏览器在中文语言下最小字体只能是 12px
,大部分浏览器都是如此。
解决方案
如果执意要设置小于 12px
的字体,那只能使用 transform: scale()
缩放属性来实现。
/* 小于12px 的字体 */
.txt {
-webkit-transform: scale(0.5)
}
兼容写法
有些浏览器允许设置小于 12px
的字体,那么你需要额外写一个类。
/* 优先采用 -webkit-transform 规则 */
.txt {
-webkit-transform: scale(0.5)
}
/* 允许的浏览器采用以下规则 */
.fontSize {
font-size:8px;
}
相关文章
- CSS基础,选择器
- This dependency was not found: * !!vue-style-loader!css-loader?……解决方案
- 前端学习 -- Html&Css -- 背景
- 前端学习 -- Css -- 文本样式
- [CSS] Purgecss to remove unused css
- [CSS] Use CSS Variables Almost like Boolean Values with Calc (maintainable css)
- [CSS3] CSS Media Queries
- css block,inline和inline-block概念和区别
- css 文字溢出省略号
- CSS 各种定位(position)方式的区别
- [CSS] Change the auto-placement behaviour of grid items with grid-auto-flow
- Atitit 使用h5技术( html css js)制作桌面程序gui界面解决方案attilax总结
- 【CSS】盒子模型内边距 ② ( 内边距复合写法 | 代码示例 )
- 绝对定位多个字居中显示的css
- 【CSS】css弹性布局、CSS hack_08
- 【CSS】css概述、语法规范、基础选择器_01
- css案例8——去除滚动条
- iStack与CSS配置实例