반응형 디자인

반응형 디자인 실습하기

  1. head태그 사이에 브라우저의 해상도를 맞추는 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/> 코드를 삽입한다.
  2. css스타일 영역에 해상도별 스타일링을 별도 추가하는 다음 코드를 삽입
/* Mobile */
@media all
  and (max-width: 600px){
  	이 부분에 모바일에서만 적용될 스타일을 정의한다.
}