html - 径向渐变在 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;
}