<meta> 태그의 viewport로 반응형 웹사이트 준비하기

반응형을 만들기 위해서 viewport라는 메타태그를 쓸 필요가 있다. 모바일 웹에 필요한 세팅을 한다. 이 태그는 W3C의 표준이 아니라서 meta viewport는 IE10 모바일 브라우저(스냅 모드)를 제외한 나머지(안드로이드, 오페라 등) 브라우저는 적용되고 있다.

meta 태그는 http-equiv, name, content 총 3가지의 속성이 있다.

• http-equiv은 항목명으로 웹 브라우저가 서버에 명령을 내리는 속성이다.
  예시로, explorer에서 정상적으로 보이고 싶으면 아래 코드를 입력하면 된다.

	<meta http-equiv="X-UA-Compatible" content="IE=edge">

• content는 메타정보를 담을 수 있게 해준다.

• name는 정보의 이름이다. 화면의 비율을 지정하는 viewport, 키워드를 지정하는 keword 등이 해당된다.

• title 태그는 브라우저의 탭에 웹사이트 제목을 나타나게 한다.

• link 태그는 HTML 파일과 분리된 CSS 파일과 연결하고 싶을 때와 같이 외부와 웹페이지를 연결하고 싶을 때 사용할 수 있다.