CSS

PostCSS는 create-react-app에 기본적으로 import되어 있다.Button1의 background는 blue여야 되지만 둘 다 red로 적용된 것을 확인할 수 있다.이는 마지막에 적용된 css파일의 background가 스타일을 덮어버렸기 때문이다.이

styled components는 javascript에서 css를 사용할 수 있도록 도와주는javascript 라이브러리다.

Tailwind CSS는 클래스 이름에 대한 모든 HTML 파일, JavaScript 구성 요소 및 기타 템플릿을 스캔하고 해당 스타일을 생성한 다음 정적 CSS 파일에 작성하는 방식으로 작동합니다.Tailwind DocsHTML 태그에 Tailwind에서 제공하는 클

LVHA = link > visited > hover > active 순으로 스타일이 덮어씌어진다. active를 사용하려면 앞의 다른 선택들 뒤에 사용해야 한다.after, before는 의미가 없는 꾸밈의 용도로 대부분 사용style이 선언된 위치(나중에 적용된 스

대부분 이태릭체를 적용하기 위해 사용font의 굵기. 일반적으로 100~900사용글꼴 스타일 적용. ,를 통해 여러개의 폰트 명시 가능. 사용자의 os환경에 따라 순서대로 적용텍스트의 줄 간격 설정(동일한 높이로 설정하기 위해 사용)글자 간격 설정단어 간격 설정텍스트

1px = 1/96th of 1in대부분 브라우저의 기본 폰트 사이즈는 16px이다.em보다는 rem이 좀 더 유용하다.1em === 부모의 font-size1rem === root의 font-size뷰포트 width값 기준 백분율뷰포트 height값 기준 백분율뷰포트

일반적으로 property, duration, timing, delay순으로 작성전환 효과를 적용할 스타일을 지정할 수 있다.전환효과가 완료되는데 걸리는 시간을 지정할 수 있다.단위는 s 또는 ms단위를 사용한다.전환효과가 시작하기 전 대기 시간을 지정한다.전환효과의

flexbox란? block요소들의 1차원적인 수직, 수평 정렬을 도와준다. >Tip: 박스들을 inline-block으로 설정 했을때 아래와 같이 여백이 남는 이유는? html에서 해당 태그들에 띄어쓰기 또는 줄바꿈이 있을 경우 여백으로 간주하기 때문이다. 용어 정

Grid의 기본 개념은 2차원 정렬이다.