问题标签 [em]

因此，这不是一个 Android 应用程序问题，因为它涉及可以为 Android、iOS、Windows 移动等的 PhoneGap Build 构建的任何东西。

我已经构建了一个应用程序，该应用程序在占屏幕宽度百分比的框中包含文本。我对此很满意，它似乎在我的 GNexus、Nexus 4、Nexus 7 和 Xoom 上运行良好。

但是我的一位 Galaxy S3 用户报告了他手机上的文本溢出问题。

我正在为文本框使用 % 宽度。我应该对我的文本大小做同样的事情还是应该使用 em （无论如何我都没有得到）？

3.5em: http://jsfiddle.net/yst9h/

56px: http://jsfiddle.net/yst9h/1/

I've got an element with a bar below it, and some Loading text like so. on Chrome the text fits neatly above the bar, which is sized to 100% of the parent it and the loading text share ( 200px width ). On Firefox and IE, however, the font is much larger(!) sending it past the bar and looking misaligned as a result. All of the browser's dev tools report that the fonts are the correct size ( when they are obviously not to the human eye ), and none of the browsers have any zoom level set ( tested different zoom levels as well, no change in the scaling difference )

This has me extremely stumped, I've been through SO and google many times over reading all of the related font inconsistency issues looking for something I've missed, and have yet to come across this one again.

Is this something I can fix simply, or will I have to wrangle with per-browser css rules to lower the font size?

我在一个网站上工作，客户想要一些 0.875em 的标题。

我在网上查了一下，现代浏览器的基本 em 单位应该是 16px。好吧，如果我在 chrome developerper 中将 text-size 设置为 1em，它会设置为 12px 而不是 16px。

一开始尝试设置body{font-size:100%}。没运气。

如何将其放回 16px 基础？

谢谢！

我读过很多关于响应式网页设计的文章，以及设计师应该如何使用相对单位而不是固定单位。在某些情况下，这对我来说完全有意义，例如段落的最大宽度。但几乎所有文章都指出，这样做的主要优点是设计适应缩放。据我所知，所有浏览器在缩放时都会缩放像素值（除非在 Firefox 中选中“仅缩放文本”）。那是因为CSS 像素不是设备像素。

实际上，在我看来，CSS 像素是一个“几乎相对”的单位，因为具有高像素密度的设备也在缩放它们（根据规范）。通常他们这样做是因为因素 2。

就我个人而言，我不明白为什么我应该对所有事情都使用相对单位。像素似乎做同样的工作，通常会产生“更清晰”的外观（因为它们不会导致亚像素渲染）。

你怎么看？我错过了什么？

深入到一个项目中，我们在字体大小中使用 em 时遇到了问题。我们有几个标记模块，我们在不同的上下文中重用它们。在不同的上下文中，计算出的字体大小不同，因此经常头疼。使用 em 对我们很重要，因为我们使用的是响应式设计。所以字体大小的可伸缩性是必须的。请参阅jsFiddle一个简单的示例。 我们怎样才能保持字体的放大和缩小，但使它不那么上下文敏感？

我正在制作一个主要使用 rem 单位作为字体大小单位以及其他属性（宽度、高度、边距等）的网站。该网站的功能之一是 #mainContent 的大小发生变化，这是由更改 html 标签中的字体大小：

CSS：

javascript:

问题是，当 #mainContent 重新调整大小时，即使我指定了它们的大小，引导程序的导航栏大小（不是字体大小）和模态字体大小也会发生变化，因此它们不会受到影响：

如何确保只有 #mainContent 受到影响，而不是所有其他元素？谢谢

我必须为项目使用计算值。最好是使用 CSS3calc属性。但是，Android Webview 原生浏览器不支持此功能。因此，我发现最简单的方法是使用 jQuery 来处理这种行为：

问题是这一次，我需要使用 em 值而不是 px 值：

这行不通。

你有任何（简单的）解决方案来处理这个问题吗？

我的响应式字体大小有问题。我将整体字体大小设置为 62.5%，现在我尝试将 h2 设置为 57px（即 5.7 em），但它不会改变。百分比也一样。如果我使用 Px，它会改变，但当然它不会与我的页面大小匹配。

我如何将pt转换为em？当我使用 Photoshop 设计模板时。软件对文本大小有 pt 格式。然后我必须将设计细节传递给开发人员，他们总是需要 em 格式的所有文本大小。我参考了这个网站http://pxtoem.com/进行转换，但只有 px 到 em 的转换。现在我使用 16 pt 作为基本字体。

我的另一个问题是，pt 和 px 之间有什么区别，而不是它的完整形式的每英寸点数和每英寸像素点。？因为我检查了 16pt 大小的高度，它只显示 16px 的高度。

我使用“em”来设置一些 div 的宽度。在这些 div 之上是另一个 div，它与下面的所有其他 div 具有相同的宽度。见下图：

简单的 jSFiddle：http: //jsfiddle.net/QxvrR/

这适用于 Firefox 和 Chrome，但在 Safari (7.0) 上，顶部 div 比下面的稍长。最后，浏览器将 em 转换为 px，Safari 似乎无法处理非整数大小的宽度（下框为 38.4px）。

上面的示例非常简化以显示问题。除了回到 px 尺寸之外，是否有人对此有解决方案/解决方法？