Inline Style CSS


Inline Style CSS

html Inline Style과 마찬가지로 Html 코드상에 Style을 정의하는 방식입니다. 단, Style을 정의할떄 Object형태로 정의해야 합니다. 작성 예제는 아래와 같습니다. const title = { color: '#000', fontWeight: '700', fontSize: '1.5rem', marginBottom: '40px', marginTop: '20px', display: 'inline-flex', width: '100%', marginLeft: '25px', } const App = () => { return ( <div className="App"> <div style={title}/> </div> ); } export default App; 장점 1) 한 소스에서 Html과 Style 정의가 가능하기 때문에 소스하나만 유지보수 하면 된다. 단점 1) 유지보수 어려움 - 각 컴포넌트에 정의된 Html을 찾아가서 수정해야 함 2) 공통 Style 적용하...


#inline #react #style

원문링크 : Inline Style CSS