所以我對 Next.JS 相當陌生，并且一直在嘗試將它與 Bootstrap 一起使用。問題是，我不能在className現場將 Bootstrap 類與我自己的自定義 CSS 類一起使用。我在這里找到了這個確切問題的兩個答案，他們都建議使用模板文字。但是，這對我不起作用。
這就是我的代碼目前的樣子。
import homeSytle from '../styles/Home.module.css'
export default function Home() {
return (
<div className='text-center h-100'>
<div className={'${homeSytle.bgMain} container-fluid'}>
<h1>Test</h1>
<button type="button" className="btn btn-primary mt-5">Primary</button>
</div>
</div>
)
}
根據這個答案，上面的代碼應該可以正常作業。但是，VS Code 一直說homeStyle從未使用過匯入，不用說，我沒有看到我的背景影像。
className如何在同一屬性中使用我自己的自定義 CSS 類撰寫 Boostrap 類？
uj5u.com熱心網友回復：
當您必須組合多個基于模塊且現成的類時，請使用反引號而不是單引號。
import homeSytle from '../styles/Home.module.css'
export default function Home() {
return (
<div className='text-center h-100'>
<div className={`${homeSytle.bgMain} container-fluid`}>
<h1>Test</h1>
<button type="button" className="btn btn-primary mt-5">Primary</button>
</div>
</div>
)
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/437650.html
上一篇：Bootstrap等于列高大小