像div旁边发光的东西

Question

有人能告诉我为什么在我的div（右侧）旁边会出现白色光晕/阴影之类的东西？起初，我认为边界比div小，但事实并非如此。这只发生在我使用深色作为背景时。 也许你不会看到，但仔细看看下面的图片。

：

以下是该行的特写：

以下是代码：

#container {
    margin: 20px auto;
    padding: 10px;
    border-top: 5px solid #000000;
    background-color: #990000;
    width: 600px;
}

Answer 1

这只是由您使用的图像工具或监视器引起的抗锯齿效果。

当对比色高时，这种情况经常发生。

在进行屏幕转储/粘贴到图像工具时转动消除锯齿并且它将消失

Answer 2

这是您输入的代码，当我在这里运行时，我绝对看不到白线。点击运行代码段，然后点击整页。然后尽可能放大。我认为它已经消失，这意味着该行可能是由您的浏览器或代码以外的其他东西引起的。

我可能会尝试使用css规范化器。祝你好运！

@font-face {
    font-family: Myriad Pro;
    src: url('fonts/MyriadPro-Regular.otf');
}
 
body {
    background-color: #DEDEDE;
    font-family: Myriad Pro;
}
 
a {
    text-decoration: none;
    color: #1738E0;
}
 
textarea:focus, input:focus, button:focus {
    outline: none;
}
 
#container {
    margin: 20px auto;
    padding: 10px;
    border-top: 5px solid #000000;
    background-color: #990000;
    width: 600px;
}

<div id="container">
  <div id="yay">
    Ugly thing...
  </div>
</div>