Firefox中的径向渐变无法正确显示

Question

我在Firefox的网站上显示径向渐变时遇到问题。在Edge和Chrome上，渐变效果似乎很好，但在Firefox上效果不佳。

在chrome和edge中，我得到了：

这是我在Firefox中看到的：

body{
  background-color: blue;
  background: -moz-radial-gradient(center, ellipse cover, #0047ea 0%, #151515 100%);
  background: radial-gradient(#0047ea,#151515 );
  z-index: 0;
}

Answer 1

您需要在身体上设置一个高度。将其设置为100vh将使渐变覆盖屏幕。

body{
  background-color: blue;
  background: -moz-radial-gradient(center, ellipse cover, #0047ea 0%, #151515 100%);
  background: radial-gradient(#0047ea, #151515);
  z-index: 0;
  
  height: 100vh;
}