카테고리 없음
Nextjs Image 반응형 처리 responsive (tailwind와 함께)
NextJs에서는 대신 를 써야 한다. 테일윈드 라이브러리를 함께 써서 반응형 처리를 한 방법을 기록해 본다. 방법 예를 들면 모바일에서는 가로 18px 세로 16px인 이미지를 max-width:768부터는 가로 36px 세로 32px로 보여준다고 하면 아래와 같이 쓴다. 1. 를 감싸는 에 모바일 사이즈 크기와, 바뀌는 점을 기록한다. 2. Image에 기본 width, height값을 쓴다. layout="responsive" 속성을 꼭 ! 써준다.
