如何将 转换为 px？答案

【问题标题】：How to convert to px?如何将 转换为 px？
【发布时间】：2010-10-23 13:48:31
【问题描述】：

我需要将 转换为 px。

仅示例（不正确）： 相当于 12px。

是否有任何公式或表格转换可以将 转换为 px？

【问题讨论】：

从技术上讲，1 到 7 范围之外的尺寸是无效的。
虽然在技术上是不可能的（正如在下面的答案中大量指出的那样），但对于我们这些有实际工作进行一些转换的人来说，我提供了这些数据点：在 Chrome 中，在Mac，字体大小呈现如下：1=10px, 2=13px, 3=16px, 4=18px, 5=24px, 6=32px, 7=48px（10 超出图表 - 最大为 7）

标签： html fonts font-size

【解决方案1】：

一般来说，您不能依赖固定的像素大小来设置字体，用户可能会缩放屏幕并且默认值并不总是相同（取决于屏幕的 DPI 设置等）。

也许看看this（像素到点）和this link。

当然，您可以将字体大小设置为 px，这样您就可以知道字体实际是多少像素。如果您确实需要固定布局，这可能会有所帮助，但这种做法会降低您网站的可访问性。

【讨论】：

哦，自从那个像素到点的链接之后，事情发生了怎样的变化。谈论最大屏幕分辨率为 1024x768.... 大声笑

【解决方案2】：

这不是那么容易回答的。这取决于使用的字体和每英寸点数 (ppi)。 This 应该概述问题。

【讨论】：

【解决方案3】：

根据The W3C：

此属性设置的大小字体。可能的值：

1 到 7 之间的整数。这会将字体设置为某个固定大小，其渲染取决于用户代理人。并非所有用户代理都可以呈现七种尺寸。

字体大小相对增加。值“+1”表示大一号。值“-3”表示三种尺寸更小。所有尺寸都属于规模 1 到 7 个。

因此，您要求的转换是不可能的。浏览器不需要使用具有特定size 属性的特定尺寸。

另请注意，W3 不鼓励使用 font 元素，而支持 style sheets。

【讨论】：

我明白了，谢谢 Tormod。我正在使用 eed3si9n 的解决方案和这个转换器pxtoem.com。现在它起作用了。感谢所有回答我的人：D

【解决方案4】：

<font size=1>- font size 1</font><br>
<span style="font-size:0.63em">- font size: 0.63em</span><br>

<font size=2>- font size 2</font><br>
<span style="font-size: 0.82em">- font size: 0.82em</span><br>

<font size=3>- font size 3</font><br>
<span style="font-size: 1.0em">- font size: 1.0em</span><br>

<font size=4>- font size 4</font><br>
<span style="font-size: 1.13em">- font size: 1.13em</span><br>

<font size=5>- font size 5</font><br>
<span style="font-size: 1.5em">- font size: 1.5em</span><br>

<font size=6>- font size 6</font><br>
<span style="font-size: 2em">- font size: 2em</span><br>

<font size=7>- font size 7</font><br>
<span style="font-size: 3em">- font size: 3em</span><br>

【讨论】：

你从哪里得到的 font-size: 值？你如何确保它们在所有浏览器中都是正确的？
@pts，我通过查看浏览器的渲染得到了它们。这取决于浏览器的实现，所以我认为我不必确保所有浏览器的正确性。在我测试过的所有浏览器中，它看起来都足够接近了。
嗯，我会在不同的浏览器中测试这个:)
@pts: 如果我的字体大小为 8 及以上怎么办？我怎么知道等效的 em？谢谢。

【解决方案5】：

使用已接受答案中的数据点，您可以使用多项式插值来获得公式。

WolframAlpha 输入：插值多项式 {{1,.63},{2,.82}, {3,1}, {4,1.13}, {5,1.5}, {6, 2}, {7,3}}

公式： 0.00223611x^6 - 0.0530417x^5 + 0.496319x^4 - 2.30479x^3 + 5.51644x^2 - 6.16717x + 3.14

并在 Groovy 代码中使用：

导入 java.math.* def 转换 = {x -> (0.00223611*x**6 - 0.053042*x**5 + 0.49632*x**4 - 2.30479*x**3 + 5.5164*x**2 - 6.167*x + 3.14)。 setScale(2, RoundingMode.HALF_UP) } (1..7).each { i -> println(convert(i)) }

【讨论】：

+1。很酷，但是您是否认为您的输入不是实际的数据点，而只是四舍五入的数字？

【解决方案6】：

这确实很旧，但 大约是

【讨论】：

对不起，“10”大约是55px

【解决方案7】：

字体大小到 em 的映射只有在没有定义字体大小时才是准确的，并且当您的容器设置为不同大小时会发生变化。

以下对我来说效果最好，但它不考虑 size=7 并且大于 7 的任何东西都只会呈现为 7。

font size=1 = font-size:x-small
font size=2 = font-size:small
font size=3 = font-size:medium
font size=4 = font-size:large
font size=5 = font-size:x-large
font size=6 = font-size:xx-large

【讨论】：