반응형 styled-components2 styled-components로 checkbox 커스텀하기 웹 사이트 제작을 하면서 체크박스를 커스텀해야할 상황이 생겼는데, 다들 css를 사용하여 커스텀하는 방법을 사용하고 있었다. 나의 경우에는 styled-components를 사용하여 커스텀을 하고 싶었기 때문에 관련 자료들을 찾아보다가 medium.com/@colebemis/building-a-checkbox-component-with-react-and-styled-components-8d3aa1d826dd Building a Checkbox Component with React and styled-components A (mostly) hack-free approach medium.com 이 분이 작성한 글을 발견하게 되었다! 체크박스 커스텀을 위해서는 4가지 컴포넌트가 필요하다. 1. 체크박스 컨테이.. 2021. 4. 22. styled-components 알차게 사용하기 이번에 정리할 내용은 styled-components가 가진 기능들을 보다 알차게 사용하는 법에 대한 것이다. styled-components는 각각의 컴포넌트들을 생성하고 그 컴포넌트들의 css를 바로 작성할 수 있게 해주는 라이브러리이다. 기존의 css나 태그의 style 속성을 사용할 때는 변수를 사용할 수 없었지만, styled-components를 사용하면 컴포넌트이기 때문에 props로 값을 받아 변수처럼 사용할 수 있다. import styled from 'styled-components'; const ImageBox = () => { return( ); }; const Image = styled.div` width: 10px; height: 10px; background: url(${pro.. 2021. 4. 22. 이전 1 다음 반응형
