$ npm install --save styled-components
import React, { Component } from 'react'
import styled from 'styled-components';
class Detail extends Component {
constructor(props) {
super(props)
}
render() {
return (
<Section></Section>
)
}
}
const Section = styled.section`
width: 100px;
margin: 0 auto;
`
export default Detail
위의 값이 html와 css로 변환되어 출력되면
<section></section>
section {
width: 100px;
margin: 0 auto;
}
import React from "react";
import { styled, createGlobalStyle } from "styled-components";
const GlobalStyle = createGlobalStyle`
* {
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
vertical-align: top;
outline: none;
}
body {
margin: 0;
font-family: Arial, Tahoma, Verdana, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
letter-spacing:-1px
}
`;
class App extends React.Component {
render() {
return (
<>
<div></div>
</>
);
}
}
export default App;