如何在 Next.js 中将图像设置为背景？

Question

我有两个组成部分：

LoginLayout应该是 Login 组件的高阶组合
Login组件是页面

我需要让登录页面有一个图像作为背景。 我尝试通过 CSS 实现这一点，但它不起作用。

这是LoginLayout ：

export default ({ children, title }) => (

// I tried to add background: url(.../img)) to this login-layout class
  <div className="login-layout">
    <Head>
      <title>Login to Tex</title>
    </Head>
    <div className="login-wrapper">{children}</div>
  </div>
);

这如何在 Next.js 中实现？

Answer 1

如@Deano 所述，确保将 CSS 附加到组件上。

import './style.css';

如果您使用 CSS 模块导入，请改为：

import styles from './MyStyles.module.css';

export default ({ children, title }) => (
  <div className={styles.loginLayout}>
    <Head>
      <title>Login to Tex</title>
    </Head>
    <div className={styles.Login-wrapper}>{children}</div>
  </div>
);

如何在 Next.js 中将图像设置为背景？

问题描述

1 个解决方案

解决方案1
0 2020-07-08 21:31:24

如何在 Next.js 中将图像设置为背景？

问题描述

1 个解决方案

解决方案1 0 2020-07-08 21:31:24

解决方案1
0 2020-07-08 21:31:24