喜欢在您的观察中注意细节...我也有这样的客户:) ...

Love the attention to detail in your observation... I've had a customer with such an eye also :) ... on checking your stackblitz, we observe the following which is a bigger issue which needs resolution:

使用以下内容注释了CSS .container>*{ position: absolute; top: 30vh; left: 30vw; } ，以观察未对齐的几个像素对浏览器放大/缩小的影响:

Commented your CSS .container>*{ position: absolute; top: 30vh; left: 30vw; } with the following to observe the effect of mis-aligned few pixels on zooming in/out on the browser:

.myMatOptions{  position: absolute;  top: 30vh;  left: 30vw; }
::ng-deep .cdk-overlay-container{left: 30vw;}
::ng-deep .cdk-overlay-pane { left:0 !important; transform:none !important;}
::ng-deep .mat-select-panel{left: 0}

以 80％的缩放比例，我们看到:

on a zoom of 80%, we see:

在 90％的缩放比例上，我们看到了渲染输出中的轻微错位:

on a zoom of 90%, we see a minor mis-alignment in the rendered output:

以 100％的缩放比例，我们看到:

on a zoom of 100%, we see:

在 110％的缩放比例上，我们看到了渲染输出中的轻微对齐错误:

on a zoom of 110%, we see a minor mis-alignment in the rendered output:

以 125％的缩放比例，我们看到:

on a zoom of 125%, we see:

这些次要的视觉问题(分别占90％和110％)在渲染的输出上-这些后面的CSS非常准确，因此没有任何基本要解决的问题. 在此处工作stackblitz

These minor visual issues (on 90% and 110%) are on the rendered output - the css behind these is exact so there is nothing fundamental to resolve. working stackblitz here