Media Queries

• 오직 CSS만을 이용해서 스크린의 사이즈를 알 수 있는 방법, 반응형 웹을 만들경우 Media Queries를 사용하면 된다.

css

@media screen and (min-width: 650px) and (min-width: 750px) and (orientiation: landscape) // <- 이거는 가로로 놓았을 경우
	div{
    	background-color: tomato;
    }
}

프로젝트에 미디어 쿼리를 이용해서 반응형 웹 만들기

• 목표
  특정 크기가 되면 기존의 로고 대신에 다른 로고로 대체되고 네브에 있던 메뉴들은 사이드바로 넘어가게 한다.