css-미디어 쿼리(반응형 웹)

반응형 웹: 화면의 크기에 따라 웹페이지 요소들이 반응해서 동작한다.

 

    @media(min-width:800px){
    div{
      display:none;
    }
  }

화면의 픽셀이 800보다 커지면 사라지게 하는 코드

 

@media screen and (min-width:800px){
	.container{
    	width: 50px;
    }
}

screen/speech/print/all

and/not/only/,

 

  <link rel="stylesheet" href="style.css">

style.css로 파일을 만들어 css코드의 중복제거 가능

 

캐싱 :

저장하다 라는 뜻

한번 파일 다운받으면 파일이 바뀌기 전까지는 웹브라우저가 컴퓨터에 저장해놨다가 파일을 요청하면 저장된 파일을 불러와 속도를 높힐 수 있다.

따라서 네트위크 트래픽을 적게 사용한다.

 

 

moblie

320px~480px

 

tablet

768px~1024px

 

desktop

1024px