img의 srcset과 sizes

w descriptor 사용

<img srcset="경로 원본크기w,
             경로 원본크기w,
             경로 원본크기w"
     sizes="(미디어조건) 최적화출력크기,
            (미디어조건) 최적화출력크기,
            기본출력크기"
     src="경로"
     alt="대체텍스트">

! src 속성은 srcset을 지원하지 않을때 적용

<img srcset="images/이미지.png 450w,
             images/이미지2.png 768w,
             images/이미지3.png 1080w"
     src="images/이미지4.png"
     alt="이미지">

뷰포트 가로가 450px 이하일 때 이미지.png (450px)
뷰포트 가로가 451~768px 일 때 이미지2.png (768px)
뷰포트 가로가 769px 이상일 때 이미지3.png (1080px)

sizes 는 고정 사이즈가 필요시 지정해준 크기의 이미지 대상 사용

x descriptor는 언급하지 않음

! ie는 지원하지 않는다 Polyfill은 https://github.com/aFarkas/respimage