[리액트]스타일,클래스 적용

리액트의 경우 html과 달리 style 적용 시 객체를 만들어 줘야 함.

 

const style = {

backgroundColor: 'black',

color: 'aqua',

fontSize: 32,

padding: '1rem'

};

위와 같이 작업 후

<div style={style}></div>

위와 같이 div style에 'style'객체가 적용됨.

 

CSS 클래스 적용

App.css를 만들어 준 후

.gray-box {

background: gray;

width: 64px;

height: 64px;

}

위와 같이 css를 작성.

import './App.css';

위와같이 임포트 해준 후

<div className="gray-box"></div>와 같이 작성해주면 CSS가 적용됨