공군소령김도지
614
2021-06-04 05:56:31
1
88

반응형 이미지 만들기 : DPR 이 무엇인가요?




  <img
      src="img/pug-charles-unsplash-small.jpg"
      alt=""
      srcset="
        img/pug-charles-unsplash-small.jpg   500w,
        img/pug-charles-unsplash-medium.jpg 1000w,
        img/pug-charles-unsplash-big.jpg    1500w
      "
    />



1.보시다 시피 제가 상단의 개 사진이 500w일때  medium 으로 바뀌게 설정을 했습니다. 

근데 w가 360만 되도 사진이 medium으로 바뀝니다.....

그래서 DPR을 1로 해줘야 코드대로 된다는데..이게 뭔소리인지 모르겠습니다. 


2. 개사진이 스몰 에서 빅으로 한번 바뀌면 그담부터 빅 사이즈만 브라우저에 표시가 됩니다. 

무슨 캐쉬 때문에 그렇다는데 빅사이즈 이미지가 캐쉬에 최종 저장되서 그런건가요? 그런거 상관없이 크기에 따라 반응형으로 바꿀려면 코드를 어떻게 수정 해야 하나요?



0
  • 답변 1

  • US네비
    78
    2021-06-04 09:32:54

    저도 이렇게는 안써봐서 잘 모르겠네요.

    아래 사이트 잘 정리되어 있는 것 같은데 참조 해보시면 좋을 듯 하네요?


    https://heropy.blog/2019/06/16/html-img-srcset-and-sizes/

  • 로그인을 하시면 답변을 등록할 수 있습니다.