我正在重新设计一个网站,我正在收到一个名单,其中包含一个代理机构所需的更改.
line-height: 1em; font-size: 11px;
在我收到的其中一个文件中有一个更改请求,要求我将这些样式更改为：
line-height: 1.2em; font-size: 11.5px;
我知道EMs可以使用十进制值,但半个像素在字体大小上是什么意思？我已经尝试使用检查器将字体大小从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>
如果我们放大到500％,我们可以看到有区别：
我认为您的浏览器必须舍入,因为半像素(实像素)不存在.
缩放100％：
圆(12 * 1.00)= 12
圆(11.5 * 1.00)= 12
缩放500％：
圆(12 * 5.00)= 60
圆(11.5 * 5.00)= 58
