css - ReactJS CSS backgroundImage 在滚动调整窗口大小时在底部创建空白

Question

我正在开发一个 react 网站的背景，我在组件上面的div中使用它，因为我只希望它成为某些组件的背景而不是所有网站。

问题是，当我滚动或调整窗口大小时，它会在图像下方显示空白区域，而且我不能在 css 中使用图像，只能使用内联样式，因为我想稍后将其存储在变量中。

希望我能得到一些有用的反馈。

render(){
    return (
      <div style={{ backgroundImage: `url(${background})`,height:"100vh",backgroundSize : "100% 100%",backgroundAttachment: "scroll", backgroundRepeat: "norepeat", backgroundPosition: "center center"}}>
          <div style={{paddingTop : '5%'}}>
        <Registration />
        </div>
         </div>

    );
    }

Answer 1

将此内联包含在样式对象中

"backgroundSize": "cover"