CSS动画仅在webkit浏览器中产生文本抗锯齿问题

Question

Bootstrap 4文本抗锯齿问题。当任何自定义css动画运行或原始的引导程序下拉动作（例如dropdown-> css transform）运行时，位置固定元素会使文本模糊。

在父position:fixed;元素中播放任何动画时，所有位置固定的元素都会变得模糊。

我认为这个问题不是由bootstrap或css造成的。此错误仅来自Webkit浏览器。我们可以为此解决方案吗？

我正在搜索并尝试所有想法和解决方案。 -webkit-font-smoothing,-webkit-antialiasing，等等……什么都没有，根本没有用！

我的职位是通过 <navbar>确定的。

所以也许是个坏主意，但是好像我们不能开发另一种稳定器方法来代替"position: fixed"吗？ -或是否存在不受影响的“基于网络的”字体类型？

我使用的是默认字体类型：

--font-family-sans-serif: -apple-system, 
BlinkMacSystemFont, "Segoe UI", Roboto, 
"Helvetica Neue", Arial, sans-serif, 
"Apple Color Emoji", "Segoe UI Emoji", 
"Segoe UI Symbol", "Noto Color Emoji";

我在等你的好想法。

---

屏幕截图

图像中的元素通常是静态的。我添加了position:fixed。但是正如您所看到的，它会影响其他所有fixed元素，包括自身。

  

注意：为清楚起见，请打开新标签页。