[CSS]반응형 웹 만들기

미디어 쿼리를 사용한다.

 

예시)

@media (min-width:1000px) {

    h1{

        font-size:20px;

    }

}

 

@media의 옆에는 브라우저의 창크기를 입력하는데

min-width의 경우 해당 크기값 이상일 때 적용이 되며,

max-width의 경우 해당 크기값 이하일 때 적용이 된다.

 

 

min- width를 사용할 경우 가장 작은 크기를 시작으로 레이아웃을 작성하여 점점 커지는 방향으로

max-width를 사용할 경우 가장 큰 크기를 시작으로 레이아웃을 작성하여 점점 작아지는 방향으로 나아간다.