배경 이미지 표시

Question

<p>프로젝트에 배경 이미지를 추가하고 싶은데 작동하지 않습니다. </p><p>전역적으로 배경 이미지를 추가하려고 했지만 작동하지 않았습니다. Next.js의 홈페이지 코드입니다.

<pre class="brush:php;toolbar:false;">'next/font/google'에서 { Inter } 가져오기 const inter = Inter({ 하위 집합: ['latin'] }) 기본 함수 index() 내보내기 { 반품 ( <div className="myindex">           dcmkl </div> ) } 이것은 global.css 파일</pre> <p>여기에 스타일을 지정하세요</p> <pre class="brush:php;toolbar:false;">.myclass{ 높이: 1000px; 너비: 1000px; 배경 이미지: url('./pexels-johannes-plenio-1103970.jpg'); }</pre> <p><br /></p>

Answer 1

로컬 이미지를 저장하는 가장 좋은 장소는 프로젝트 루트에 있는 공용 폴더(및 해당 하위 폴더)입니다. 이 위치의 이미지를 다음과 같은 페이지나 구성 요소로 가져올 수 있습니다

으아악

그런 다음 인라인 스타일을 적용합니다.

으아악