Chrome在设备上呈现基于em的字体大小的方式有所不同 [英] Chrome renders em based font sizes differently on devices

问题描述

比较版面中页面之间的字体大小时遇到​​问题.我在主体上用font-size: 100%;设置了字体，在我的段落标签上用font-size: 1em;设置了字体.

I'm having an issue comparing font sizes between pages on my layout. I have the font set on the body with font-size: 100%; and on my paragraph tags with font-size: 1em;.

我有一个包含CSS列和两列布局的两列页面集.字体在单列页面上变大.页脚和网站主要部分中的font-size: .75em;渲染效果也不同.

I have a two column page set with CSS columns and a single column layout. The font is rendering larger on the single column page. It's also rendering differently with font-size: .75em; in the footer and on a main section of my site.

我确定它仅是Chrome，并且似乎是导致Nexus 7出现问题的原因.该问题在iPad 3的Chrome上不是问题.

I've determined that it's Chrome only and appearing to cause the issue on the Nexus 7. The issue is a non issue on Chrome in an iPad 3.

有人对此有任何经验吗?

Does anyone have any experience with this?

推荐答案

这些是2个不同的操作系统，通常在设备之间具有这些不规则性是很正常的. EM基于默认的字体大小，如果未声明为1，则os取决于屏幕分辨率将声明为1. font-size:100%不会执行任何操作，您应该声明一个恒定的字体大小，即主体中的font-size:12px.

These are 2 different OS, this is usually regular to have these irregularities between devices. EM is based on the default font-size, if haven't declared one, the os depending on the screen resolution will declare one. font-size:100% won't do anything, you should declare a constant font-size i.e font-size:12px in the body.

那么您应该具有一致性或接近一致性.

Then you should have consistency or close to it.

这篇关于Chrome在设备上呈现基于em的字体大小的方式有所不同的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！