반응형 웹

반응형 웹

 

웹페이지 하나로도 사용자가 사용하는 브라우저에 따라 알맞게 서비스하는 것을 말한다. 사용자의 브라우저가 데스크탑이면 데스크탑에 맞도록, 태블릿 pc 이면 태블릿 pc 에 맞도록 스마트폰이면 스마트폰에 알맞도록 자동으로 반응해서 변경되는 것을 말한다.

 

미디어쿼리 (media query)

• 사용자가 요청하는 장치에 따라 css를 다르게 설정하기 위한 기술

 

반응형 웹을 위한 설정

• meta 태그 : 웹 페이지에 대한 추가 정보를 제공
• 뷰포트 설정 : 컴퓨터 그래픽스에서 내용을 표시하는 영역을 뜻한다.
  • 스마트폰이나 태블릿 pc 의 반응형 웹 처리를 위해 반드시 뷰포트를 설정해야 한다.
  • 설정하지 않으면 desktop 기준으로 보인다.
  • width : 화면너비 --> device-width 로 적는 것이 일반적
  • height : 화면 높이 --> device - height 로 적는것이 일반적
  • initial-scale : 초기 확대 비율 -> 1.0 으로 적는 것이 일반적
  • user-scalable : 확대 축소 여부(yes, no)
  • minimun- scale : 최소 확대 비율(1.0)
  • maximun- scale : 최대 확대 비율(2.0)