모던 웹의 핵심 CSS
A A

상속

아직 감이 잘 안 와서 나중에 하다가 충돌하는 문제 있으면 다시 정리할 것

 


 

반응형

meta viewport 설정에 원하는 너비를 삽입하면 그 너비에 알맞게 웹페이지가 표시됨.

해당 태그가 없다면, 대부분의 스마트폰에서는 기본적으로 980px에 맞게 웹페이지가 표시됨.

그렇다고 width에 임의의 숫자를 지정하여 넣는다면, 다양한 기기에 대응이 어려울 수 있음.

따라서 사용자의 기기의 알맞은 너비값을 가져올 수 있도록 하는 태그

<meta name="viewport" content="width=device-width">

 


 

CSS 미디어 쿼리

media-feature-rule : media (미디어)조건

이 중에서는 min-width, max-width, orientation 정도가 많이 쓰임.

(최소 이 픽셀 이상일 때만 적용 / 이하일 때만 적용 / 가로방향landscape일 때만 혹은 세로방향portrait일 때만)

(미니멈/맥시멈 조건을 거는 이유? 기기마다 해상도가 다르니까, 조건을 나누어서 설정해주면 기기에 알맞는 화면을 제공할 수 있겠지)

 

 

Copyright 2024. GRAVITY all rights reserved