我遇到了一些不错的 CSS 设计，我正试图在我自己的网站上复制它们。问题是，这些设计是以图像的形式呈现的……实际页面的屏幕截图。这意味着我一直在尝试在自己的 CSS 中复制设计。
这是问题所在：我正在渲染的文本在我的 CSS 中被着色为灰度（所有 rgb 值都相等），但是如果我截取页面并放大，您可以在整个文本中看到彩色像素。原始设计没有这些……它是完全灰色的，因此看起来更加平滑。
这是常规尺寸的原件（看起来非常光滑）：
在这里它被放大了（注意所有像素都是灰度的）：
现在，这是我尝试的常规尺寸（注意它看起来有多粗糙）：
并放大（查看所有彩色像素）：
这里到底发生了什么？如何在没有彩色像素的情况下实现原始设计的平滑外观？