Chrome上的字体大小呈现问题不一致 [英] Inconsistent font size rendering issue on Chrome

问题描述

我在我的网站上遇到了css问题。所有页面的字体大小不一致。不同之处在于较大字体大小的一种版本和常规小字体大小的一种版本。小字号是我喜欢的字号。 如果页面以大字体显示内容，则在重新加载页面几次后会将其更改为较小的内容，如果您右键单击并选择检查，它也会立即更改回较小的内容元素。因此，我不知道我该如何ping这个问题。
下面是屏幕截图，一个是大字体，另一个是小字体，再小字体也是我喜欢的。

解决方案

body {font-size：1.6rem;} 可能是你的问题......你可以从你的style.css中找到它，它应该更加一致。它看起来像chrome可能不喜欢身体上的rem，如链接问题所示

从style.css中的以下类定义中删除/更改坏行应该解决您的问题

  body，button，input，select，textarea {
 color：＃404040; 
 font-family：sans-serif; 
 font-size：16px; 
 font-size：1.6rem; 
 line-height：1.5; 
} 
  

类似的SO问题

Text +问题：

这似乎是一个Chrome漏洞;请参阅问题319623：在CSS中使用％+ REM时出现问题和/或部分合并重复：问题320754：字体大小不会继承，如果html的字体大小为百分比， / p>

I am having an css issue on my site. The font size is not consistent across all pages. The difference is one version of bigger font size and one version of a regular small font size. The small font size is the one I prefer. If the page is showing the content in big font, it will change it back to a smaller one after reload the page for a couple of times, it also changes back to the smaller one right away if you right click and select inspect element. Thus, I am not sure how can I ping point the issue. Here are the screenshots, one with the big font and one with the small font, and again the small font is the one I prefer.

解决方案

body { font-size: 1.6rem;} might be your issue... you can axe that from your style.css and it should be more consistent. It looks like chrome might not like rem on the body as can be seen in the linked question

removing/changing the bad line from the following class definition in style.css should fix you up

body, button, input, select, textarea {
   color: #404040;
   font-family: sans-serif;
   font-size: 16px;
   font-size: 1.6rem;
   line-height: 1.5;
}

Similar SO question

Text + good links from answer on other question:

"This seems to be a Chrome bug; see Issue 319623: Rendering issue when using % + REMs in CSS, and/or a partly-merged duplicate: Issue 320754: font-size does not inherit if html has a font-size in percentage, and body in rem"

这篇关于Chrome上的字体大小呈现问题不一致的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！