단위 정리 (vh/vw/calc)

단위 정리 (vh/vw/calc)

px, em, rem을 넘어서서 요새 많이 쓰이는 단위를 정리해보겠습니다. 사용함에 있어서 굉장히 편히라고 게다가 IE9부터 지원을 하기 때문에 앞으로의 쓰임이 더욱 기대되는 단위라고 합니다! 1. vw, vh ex) width:100vw; height:100vh; width에는 vw를 hright에는 vh를 사용합니다. 이 부분은 반응형웹과 같은 곳에서 쓰일수록 더욱 편리함이 높아집니다. 이 단위는 요소의 뷰포트값의 100분의 1을 하는 값을 뜻합니다. 즉 값에 해당하는...
단위 정리 (vh/vw/calc)

transform 속성

transform 은 변형시키다라는 의미를 가지고 있는데 CSS의 transform 속성을 이용하여 이동(translate), 크기변화(scale), 회면(rotate), 기울기(skew)등의 효과를 줄 수 있다. 1. 이동 transform:translate(x,y) css.css .ex{ background-color: #000000; transform:translate(50px,50px); } 위 값으로 속성값을 주면 x축y축으로 50px 만큼씩 이동한다. 2. 크기조절...