最近我阅读了不少关于字体大小调整的文章，其中大部分都批评使用像素作为一种不可原谅的错误（好吧，也许不那么严重，但你懂的），因为在旧版浏览器中无法正确调整大小。
我真的希望有一个标准来规范自己的使用。过去我使用的是像素，仅仅因为它简单易懂，并且相当容易实现指定设计中所需的精确字体大小 - 但现在我怀疑是否应该使用像素。
最近我在项目中使用了 em, 因为它需要文本调整功能，我使用 jQuery 实现了这一点。但我发现如果你有两个元素内部都指定了 em 大小，它会变得非常恼人，因为 em 会放大（希望这讲得清楚）
所以我想知道是否可以使用 % 来调整字体大小，我看到一些大型网站使用了这种技术（例如雅虎），从我的理解来看，它似乎拥有 em 的所有优点，而没有令人难以忍受的放大问题。
简而言之，我只是想知道使用 CSS 中的百分比字体大小是否存在任何问题？与使用像素相比，它是否更好地调整字体大小？它是否有任何明显的缺点？
如果问题前的描述有点太长了，我很抱歉 : / 我还在适应整个问答过程中。
rem（根em）进行大小调整。其大小不会受到父元素em大小的影响。:root伪元素上设置字体大小来实现，例如：:root {
font-size: 16px;
}
body，但没有检查），也许还可以包括浏览器支持问题（如果有的话）。 - Canned Man:root元素是html元素，而不是body元素。 - user3546284试着使用这个
body {
margin: 0px;
padding: 0px;
font-size: 62.5%;
}
body>#wrapper {
font-size:1em;
}
所以，当你在"wrapper"内使用类似于1em的尺寸时，你会得到一个非常接近10px的大小。以下是一个示例表格：
3em == 30px
.5em == 5px
8.5em == 85px
这将有助于您进行过渡。
附：当然，在 body 后面需要一个包装器标签。
在我所经历的网络设计中，使用百分比来设置正文的字体大小是标准，然后再使用ems来改变字体大小。您可以在body标签外部使用百分比而不会产生负面影响，但我认为许多开发人员觉得ems更容易使用（任何人都可以纠正我）。
危险在于如果使用ems来设置正文字体大小，在旧版浏览器中会出现错误显示文本，特别是当进行缩放时。
有一个名为FitText的jQuery插件。它根据百分比调整文本大小。如果访问者由于某种原因禁用了JavaScript，则会显示为正常文本，因此请设置合理的PX或EM备份。
它依赖于jQuery，因此您需要在页面中包含它（如果您还没有它）。
/*global jQuery */
/*!
* FitText.js 1.0
*
* Copyright 2011, Dave Rupert http://daverupert.com
* Released under the WTFPL license
* http://sam.zoy.org/wtfpl/
*
* Date: Thu May 05 14:23:00 2011 -0600
*/
(function( $ ){
$.fn.fitText = function( kompressor, options ) {
var settings = {
'minFontSize' : Number.NEGATIVE_INFINITY,
'maxFontSize' : Number.POSITIVE_INFINITY
};
return this.each(function(){
var $this = $(this); // store the object
var compressor = kompressor || 1; // set the compressor
if ( options ) {
$.extend( settings, options );
}
// Resizer() resizes items based on the object width divided by the compressor * 10
var resizer = function () {
$this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)));
};
// Call once to set.
resizer();
// Call on resize. Opera debounces their resize by default.
$(window).resize(resizer);
});
};
})( jQuery );
% 的问题和错误只在误解中存在。
元素从其父级继承字体大小，除非被更具体的选择器覆盖。例如：
strong {font-size: 120%}
这个例子定义了强调元素的字体大小，使其文本始终比周围的文本大，在任何上下文中使用。假设标题和段落使用不同的字体大小，则此示例中的强调单词将比其周围的文本更大。来源w3.org
元素从其父元素继承字体大小。因此，如果为body元素（或默认情况下的html元素）指定了字体大小，则所有其他元素都会继承该值（除非被更具体的选择器覆盖）。
body {
font-size: 62.5%;
}
在编写响应式设计时，使用百分比是一个简单易懂的方式，也是一种良好的响应式设计实践。但在某些情况下，需要使用rem来引用:root的值；例如，当元素在另一个元素内重复使用时，如果不希望其被调整大小，则必须使用rem。
当然，你可以逐渐习惯这种思维方式，但许多人更喜欢尽可能地使用rem，并将其设置为1加上一些小数。然后在CSS的开头设置这个值：
html {
/* scaled version of users default setting */
font-size: 62.5%;
}
var fontSize = 15; // (em) input
var fontResize = -1;// (em)input
fontSize = fontSize+fontResize; //current div
for(every inherent parent classname == 'classname-em')
document.classnameParentSize[numberofclass] = classnameChildSize[numberOfClass]/100*90;
简单来说，这个脚本需要调整一些字体的大小，当完成后，它还会查找一些父级div来调整这些字体的大小，除了它们固有的大小外，它们将缩小10％。通过一些仔细思考，您将得到正确的转换结果。同时尽量避免使用填充和边框宽度。
div元素，一个在另一个内部，每个元素的font-size都是110％，那么它将被计算为完全相同的font-size：1.1em。除非我真的弄错了。 - David Thomasem和％时使用了不同的值。如果我让这些值相等（1em:100％），结果就会匹配：http://jsfiddle.net/BoltClock/gHe5S/1 - BoltClock