React 스타일 적용하는 방법

 

#1 css파일에서 수정하기위해 클래스를 적용하는 방법

  카멜케이스 방식으로 작성하는 className으로 class지정.

  * 자바스크립트 기반이기때문에 class는 이미 다른용도로 사용되고 있기 때문

(App.jsx)

<div className="nav">
	<h1>Title</h1>
</div>

 

 

#2 인라인 방식으로 스타일 지정하는 방법

  style={ { 속성명 : '속성값' } }  형식으로 사용합니다.

  {} 안에 {}자료형 으로 넣기 때문에 2번 사용됩니다. 

  여러가지 속성을 사용할때는 ,로 함께 지정할 수 있으며, font-size, background-color 같이 하이픈(-)이 있는 속성들은 -을 빼고 단어들을 붙여 카멜 케이스 형식으로 작성합니다.

(App.jsx)

<div className="nav">
	<h1 style={{color:'red', fontSize:'32px'}}>Title</h1>
</div>