文章/答案/技术大牛

发布

社区首页 >问答首页 >反应MUI背景图像而不是全屏

问反应MUI背景图像而不是全屏
EN

Stack Overflow用户

提问于 2022-10-23 02:59:23

回答 1查看 37关注 0票数 0

我有一个带有MUI容器组件的登录页面。

我想为整页设置一个背景图像。我用的是反应路由器。

我给外部div添加了如下样式：

<div
      style={{
        backgroundImage: `url(${coralBackground})`,
        backgroundSize: 'cover',
        backgroundRepeat: 'no-repeat',
        backgroundPosition: 'center',
        width: '100vw',
        minHeight: '100vh',
      }}
    >

但是，该页面如下所示：

当我删除MUI容器时，它占用了整个空间。

我如何摆脱顶部的白色部分，使图像占据全部空间？

reactjs

material-ui

vite

回答 1

Stack Overflow用户

发布于 2022-10-23 04:25:01

这很可能是因为以下几种风格之一在反应范围之外应用了一些样式：

将反应DOM呈现到.
<body>标记.
或<html>标记.

确保创建一些CSS，使所有这些都具有margin: 0; padding; 0。

另一种可能是在基本的index.html中，您可能有一些占用空间的元素，需要删除。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/74168393

复制

相似问题

问反应MUI背景图像而不是全屏
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问反应MUI背景图像而不是全屏EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问反应MUI背景图像而不是全屏
EN