프론트엔드

Font 단위 px > 절대크기, 절대 크기를 지정해야 할 경우 사용 % > 상대크기, 부모 태그 폰트 사이즈 기준 => 레이아웃 지정 시 주로 사용(widgh, height) em > 상대크기, 부모 태그 폰트사이즈 기준 > 폰트 사이즈에 사용 rem > 상대크

Transform translateX(n) translateY(n), translate XY(n) n px만큼 지정한 방향으로 이동 scale(n), scaleX(n), scaleY() n 만큼 지정한 만큼 크키조절 rotateX(n), rotateY(n), ro

Flex 속성 flex-direction : row | row-reverse | column | column-reverse > row(default) >row-reverse >column >![](https://velog.velcdn.com/images/dia

Grid 속성 grid-template-columns : 200px 200px 200px (너비 200px 칼럼 3개 지정) grid-template-row : 100px (줄 높이 100px) grid-template-columns: repeat(3, 1fr)

Layout 종류 1. Fixed Layout • 고정너비(px)로 구성 • 화면 해상도에 상관없이 동일한 너비로 표시 • 화면 해상도에 따라 과도한 공백 혹은 스크롤 유발 • ex. 네이버 pc버전 사이트 2. Fluid Layout • 백분율(%)로 구성

DOM이란? * Document Object Model * HTML 문서에접근하기위한인터페이스(interface) 기본 DOM * 페이지 로드 : DOMContentLoaded * 요소 선택 : querySelector, getElementByClassName 등 *