我使用CSS线性渐变为背景做了这些条纹，但它们看起来并不清晰。无论是在桌面上还是在移动屏幕上

Question

边框在桌面上显示有点像素化，边缘/边框不像在移动屏幕上那样清晰。我想用它作为一些东西的背景。可以做些什么来解决这个问题？这是我的codepen的链接 -

https://codepen.io/abhishekakade/full/dKVJLR/

body {
  display: inline-block;
  height: 95vh;
  width: 97vw;
  background-repeat: no-repeat;
  background-image: repeating-linear-gradient(
    145deg,
    #333 0%,
    black 30%,
    yellow 30%,
    goldenrod 35%,
    black 35%,
    black 40%,
    yellow 40%,
    goldenrod 60%,
    #000 60%,
    #000 65%,
    yellow 65%,
    goldenrod 70%,
    black 70%,
    #333 100%
  );
}

Answer 1

只需this。

body {
  display: inline-block;
  height: 95vh;
  width: 97vw;
  background-repeat: no-repeat;
  background-image: repeating-linear-gradient(145deg,
    #333 0%, black 29.9%,
    yellow 30.1%, goldenrod 34.9%,
    black 35.1%, black 39.9%,
    yellow 40.1%, goldenrod 59.9%,
    #000 60.1%, #000 64.9%,
    yellow 65.1%, goldenrod 69.9%,
    black 70.1%, #333 100%
  );
}