0

我在下一个 js 中有一个应用程序，它也使用脉轮 UI。我正在尝试向应用程序添加页脚，但无法强制导航栏下的组件占据屏幕的剩余高度。

我认为我的问题是我没有正确地将 CSS 样式传递给组件。

_app.tsx

import '../styles/globals.css';

function MyApp({ Component, pageProps }) {
  return (
    <ChakraProvider theme={theme}>
    <Navbar></Navbar>
    <Component id='component-container' {...pageProps} />
  )
}

export default MyApp

styles/globals.css

#component-container {
  height: 100%
}

即使我将其设置#component-container为类似color: white我看不到此 CSS 应用于子组件的内容。我认为我没有正确地将 CSS 传递给组件。

如何正确地将 CSS 应用于下一个 js 中的所有组件？

4

1 回答 1

1

您需要将该ID传递给该组件内的 HTML 元素...现在您只是将该 ID 作为道具传递给该组件，并且其中可能没有任何元素具有该 ID（因为我不知道代码适用于您的组件）。进入该组件，然后将该 ID 提供给您想要的元素（可能是第一个 DIV 元素），或者将其作为道具传递给该元素

于 2021-05-04T07:23:59.837 回答