default로 쓰이는 세팅들
*, *::before, *::after
{ box-sizing: border-box;}
body { margin: 0;
font-size: 1rem;
}
img {
display:block;
max-width: 100%;}
Tips(팁)
line-height, text-transform, letter-spacing, vw, vh, transitions, gradients 등을
사용하여 디테일을 살리자
min-height: 50vh나 100vh로 세팅
margin: 0 auto; <- 중간정렬
margin-left: auto; margin-right: auto; <- 중간정렬
font-size는 rem으로 세팅(1rem = 16px)
padding과 margin은 em으로 세팅
background-image를 사용할때는 background-color도 같이 한다.(in case the image doesn't load)
background-blend-mode: screen/multiply/overlay를 주로 사용
flex-item이 img인 경우에 flex-basis를 적용할때에는 크롬에서의 버그로
min-width:0; min-height:0도 같이 적어줘야한다.
flex-flow = flex-wrap + flex-direction