다시 보아야할 CSS

transform-origin: x,y;

 

Margin-block-start : 20px -> 요소 상단 마진 20 적용됨.

Margin-block-end: 30px -> 요소 하단 마진 30 적용됨.

Padding-inline-start -> 요소 우측 패딩 적용

Padding-inline-end -> 요소 좌측 패딩 적용

 

font-size: clamp(min, val, max);

min(100px, 60%) -> 다른 단위를 사용할 때 유용함. 입력된 숫자를 비교하여 작은 수를 반환함. max도 동일하게 사용하며, 대신 큰 수를 반환

 

가상 클래스 - 싱글 콜론

:link, :visited, :hover, :active, :first-child, :nth-child

 

가상 엘리먼트 - 더블콜론

::first-letter, ::first-line, ::before, ::after

 

display: -ms-flexbox!important;

display: flex!important;

 

-ms-flex-preferred-size: auto;

flex-basis: auto;

 

-ms-flex-flow: row nowrap;

flex-flow: row nowrap;

 

-ms-flex-pack: start;

 justify-content: flex-start;

 

-ms-flex-direction: row;

flex-direction: row;

 

 

form:focus-within { // focus의사 클래스와 일치하거나 그 자손 중 하나가 :focus와 일치하는 요소를 말함.

Border:1px solid red;

}

 

Outline

Outline-offset

 

pointer-event:none

overscroll-behavior: contain;
- 인접한 스크롤 영역에 스크롤 체인을 방지 (바운스 효과 또는 새로고침)