[NEXTJS] style jsx 설정 방법

Next.js에서 css-in-js 작성하는 방법

1. inline css(not cool)

2. <style jsx> 작성

- 정의한 컴포넌트 파일 안에서만 유효함. 다른 컴포넌트에 영향을 주지 않음.

export default function index () {
  return (
  	<nav></nav>
	<style jsx>`{
	  nav {
    	background-color: red;
      }
	}`</style>  
  )
}

 

 

전역 style 설정 방법

pages/_app.js를 만들면 됨.

 

APP COMPONENTS APP PAGES차이점