电光 大佬有话说 :
为什么CSS里同字号,Firefox显示出来比Chrome小?
本帖最后由 电光 于 2021-12-3 10:02 编辑
CSS是这样写的:
:root {
–bs-body-font-size:0.875rem;
}
font-size: var(–bs-body-font-size)
控制台里看,Firefox和Chrome解析出来都是 14px,
可是实际显示效果Firefox的比chrome要小,如果Chrome显示的是14px的话,Firefox显示的也就是Chrome中的12PX
效果如下图
Chrome
Firefox
CMBCHINA 大佬有话说 :
Chrome最小只支持12px,其他浏览器支持更小
想要Chrome支持小于12像素只能用css的镜像缩放 比如22的50% 就是11px了
v233 大佬有话说 :
缩放或者是尺寸问题吧,既然Firefox和Chrome渲染出的都是一样的,你可以试试换一种写法再试试?或者你弄个页面 就单纯写font-size: 14px; ,看看两个浏览器是不是一样的大小?我没用过Firefox,一直用的都是Chromehttps://cdn.jsdelivr.net/gh/master-of-forums/master-of-forums/public/images/patch.gif
pulpfunction 大佬有话说 :
缩放了是不
电光 大佬有话说 :
本帖最后由 电光 于 2021-12-3 21:45 编辑
CMBCHINA 大佬有话说 : 2021-12-3 10:03
Chrome最小只支持12px,其他浏览器支持更小
想要Chrome支持小于12像素只能用css的镜像缩放 比如22的50%…
@v233 大佬有话说 : 2021-12-3 10:02
缩放或者是尺寸问题吧,既然Firefox和Chrome渲染出的都是一样的,你可以试试换一种写法再试试?或者你弄个 …
破案了,是因为bootstrap默认font-family的原因,chrome和firefox对这个字体集的英文字体渲染结果不一样。渲染出来的英文的在firefox下面就小一号,中文的大小不受影响。
把foundation的字体集抄过来替换上就好了。
bootstrap官方网站也存在这个问题,因为也是用bootstrap搭建的。
v233 大佬有话说 :
电光 大佬有话说 : 2021-12-3 21:40
破案了,是因为bootstrap默认font-family的原因,chrome和firefox对这个字体集的英文字体渲染结果不一 …
恭喜恭喜,bootstrap现在用的少了,zui这个新儿子发现倒挺不错的:lolhttps://cdn.jsdelivr.net/gh/master-of-forums/master-of-forums/public/images/patch.gif