Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- 솔리디티
- 설치
- 깃허브
- 블록체인
- 일반유저
- 리눅스
- 우분투
- 노드
- 전역설치
- Docker
- wget
- Sequelize
- 이더리움
- 시퀄라이즈
- node.js 교과서 따라하기
- 라우터
- centos
- 리액트를 다루는 기술
- MariaDB
- 변수
- 쉘스크립트
- immer
- npm
- 자바스크립트
- 리액트
- wsl
- 벨로포터
- 환경변수
- 머클루트
- 머클트리
Archives
- Today
- Total
코드코코
[리액트] CSS module 본문
CSS module
-CSS 클래스가 중첩되는 것을 완벽히 방지
-CRA 로 만든 프로젝트에서 CSS Module 를 사용 할 때, CSS 파일의 확장자를 .module.css 로 한다.
-styles.icon 이런 식으로 객체안에 있는 값을 조회
>>만약 클래스 이름에 - 가 들어가 있다면 다음과 같이 사용: styles['my-class']
>>여러개가 있다면 다음과 같이 작성: ${styles.one} ${styles.two}
>>조건부 스타일링 : ${styles.one} ${condition ? styles.two : ''}
- Sass 에서도 사용가능 : 확장자를 .module.scss 로
'기록 > 정리' 카테고리의 다른 글
[자바스크립트] VS CODE에서 console.log 자동완성하기 (0) | 2021.10.29 |
---|---|
[리액트] styled-components (0) | 2021.10.26 |
[리액트] Sass(Syntactically Awesome Style Sheets) (0) | 2021.10.26 |
[리액트] import * as React from 'react'; (0) | 2021.10.25 |
[리액트] Immer (0) | 2021.10.25 |