Html 在字体大小CSS属性中，半个像素意味着什么？

我目前正在重新设计一个网站，我从一家机构收到了一份清单，上面列出了所需的更改

站点的标题菜单当前具有以下样式：

line-height: 1em;
font-size: 11px;

在我收到的其中一份文档中，有一个更改请求，要求我将这些样式更改为：

line-height: 1.2em;
font-size: 11.5px;

我知道EMs可以使用十进制值，但半个像素的字体大小意味着什么？我曾尝试使用inspector将字体大小从12更改为11.5和11，从11更改为11.5是可见的，但从11.5更改为12的字体大小只移动了一点（我仅将间距更改了一点，但在所有3个示例中都设置为1em）。您可以查看以下屏幕截图：

---

那么，在网页的上下文中，这半个像素意味着什么呢？这是跨浏览器吗？5像素对字体大小有什么影响？

我认为有区别。您忘记了页面的缩放级别

例如：

<p style="display: inline-block; font-size: 12px; border : 1px red solid;">
aAa
</p>
<p style="display: inline-block; font-size: 11.8px; border : 1px red solid;">
aAa
</p>
<p style="display: inline-block; font-size: 11.5px; border : 1px red solid;">
aAa
</p>
<p style="display: inline-block; font-size: 11.2px; border : 1px red solid;">
aAa
</p>
<p style="display: inline-block; font-size: 11px; border : 1px red solid;">
aAa
</p>

aAa


aAa


aAa


aAa


aAa

如果我们放大到500%，我们可以看到有一个区别：

我认为你的浏览器必须把它四舍五入，因为半像素（真实像素）不存在

缩放100%：

四舍五入（12*1.00）=12

圆形（11.5*1.00）=12

缩放500%：

圆形（12*5.00）=60

---

Round（11.5*5.00）=58

浏览器绘制字符时，

字体大小

属性用作参数，因此它会影响字形的大小。但是，当字形光栅化为位图时，例如，将

字体大小增加
0.5px
的效果可能会消失。浏览器可能以不同的方式执行光栅化。此外，它们可能使用也可能不使用亚像素渲染，并且以不同的方式使用

如果
行高
已设置为
1em
并且
字体大小
从
11.5px
增加到
12px
，则行框的高度可能保持不变或增加一个像素，具体取决于浏览器应用的舍入