본문 바로가기

vh2

[CSS] 다양한 반응형 CSS 단위 (%, em, rem, vw, vh) 절대 단위 / 상대 단위절대 단위 : in, cm, mm, pt, px가 있으며 출력장치(모니터)의 물리적 속성을 아는 경우 효율적상대 단위 : %, em, rem, vw, vh이 있으며 기종간, 플랫폼 간의 호환성을 유지하는데 유리​⇒ 모바일/태블릿/웹사이트 모두에 호환되는 반응형 어플리케이션을 만들고자 한다면,     상대단위를 사용하는 것이 유리하다.CSS 절대 단위pxptpx (pixel)가장 기본적으로 사용되는 단위입니다.이것은 픽셀단위라는 고정값에 따라 정해지기 때문에 화면의 크기나 확대와 같이사용자가 임의로 정의할 수 없는 고정된 값을 말합니다.이 단위는 가장 기본이 되는 단위이기 때문에 앞으로 설명할 다른 단위들의 기준이 됩니다. pt (point)1 px = 0.75 ptCSS 상대 단위.. 2024. 5. 23.
[CSS] 뷰포트(viewport), 뷰포트 단위(vw, vh, vmin, vmax) 1. 뷰포트(Viewport)뷰포트(Viewport)는 사용자에게 보여지는 웹페이지의 영역으로 반응형 웹을 만들 때 고려되는 사항이다.  반응형 웹(Responsive Web)은 모바일, 테블릿, PC 등  다양한 디바이스의 디스플레이에 맞춰 뷰포트가 변하는 웹 사이트를 말하는 것이다. 즉, 화면이 바뀔 때마다 화면에 맞춰 스타일이 바뀌게 되는 웹 형태를 말한다. 2. 뷰포트(Viewport) 세팅- HTML5 부터 태그로 각 디바이스에 따른 뷰포트에 맞춰 렌더링 영역을 설정할 수 있다.content=width=device-width페이지 너비를 해당 디바이스폭의 넓이값을 따르도록 지정(디바이스에 따라 폭의 넓이는 제각각입니다.)initial-scale=1.0처음 페이지 로딩 시 확대/축소가 되지 않은 .. 2024. 5. 23.
728x90
반응형