React - CSS - reset,createGlobalStyles
#1.리셋css 넣고,글로벌 스타일 넣으면 된다.
import reset from "styled-reset";
import { createGlobalStyle } from "styled-components";
const globalStyles = createGlobalStyle`
${reset}
a{
text-decoration:none;
color:inherit;
}
*{
box-sizing:border-box;
}
body{
font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-size:16px;
}
`;
export default globalStyles;
#2. 적용은 root부분( 엔트리 포인트 )에 감싸주면 끝!
import React from "react";
import Router from "./Router";
import GlobalStyles from "./GlobalStyles";
function App() {
return (
<>
<Router />
<GlobalStyles />
</>
);
}
export default App;
DOS IMPACT - WEB Developer
KIM DO YOUNG
WEB : REACT JS | REACT NATIVE | GraphQL PRISMA
'React JS > Lecture' 카테고리의 다른 글
React - styled-media-query 미디어 쿼리 사용법 (0) | 2020.02.03 |
---|---|
React - Theming , styled-component ThemeProvider 사용법 (0) | 2020.02.03 |
React - Hook 리액트 훅 사용법 정리 (2) useQuery (0) | 2020.02.03 |
React - Hook 리액트 훅 사용법 정리 (1) useState,useRef,createRef (0) | 2020.02.02 |
React 리액트 - Redux 대체해서 ApolloClient 써보기 (0) | 2020.02.02 |