背景画像を表示

Question

<p>プロジェクトに背景画像を追加したいのですが、機能しません。 </p><p>背景画像をグローバルに追加しようとしましたが、うまくいきませんでした。これは Next.js のホームページ コードです。 </p>

<pre class="brush:php;toolbar:false;">import { Inter } から 'next/font/google' const inter = Inter({ サブセット: ['latin'] }) デフォルト関数のエクスポートindex() { 戻る （ <div className="myindex"> dcmkl </div> ) } これは global.css ファイル</pre>です。 <p>ここにスタイルを適用</p> <pre class="brush:php;toolbar:false;">.myclass{ 高さ: 1000ピクセル; 幅: 1000ピクセル; 背景画像: url('./pexels-johannes-plenio-1103970.jpg'); }</pre> <p><br /></p>

Answer 1

ローカル イメージを保存する最適な場所は、プロジェクトのルート ディレクトリにあるパブリック フォルダー (およびそのサブフォルダー) です。次のように、この場所からページまたはコンポーネントに画像をインポートできます。 リーリー

次に、インライン スタイルを適用します:

リーリー