FrontEnd/React

Componet 내부에서 Style 사용하기!

BlancPong 2022. 8. 31. 09:28
728x90
import './App.css';
import Hello from './components/Hello'

function App() {
  const name = 'react';
  const style = {
    backgroundColor: 'black',
    color: 'aqua',
    fontSize: 24, // 기본단위 px
    padding: '1rem',// 다른 단위 사용 시 문자열로 설정
  }
  return (
    <>
      <Hello />
      <div style={style}>{name}</div>
    </>
  );
}

export default App;

인라인 스타일은 객체 형태로 작성 해야 합니다.

그리고 네이밍을 camelCase 형태로 네이밍 해야합니다.

그럼 위와 같이 출력 됩니다!