• webmini life skin Ver 1.3.2 update view
  • 사이트 제작 문의 오랜 경험을 바탕으로 웹퍼블리싱을 해드립니다 제작 문의하기
  • 블로그 리뷰 문의 검색엔진최적화로 제품 리뷰를 해드립니다 리뷰 문의하기

다크모드 이미지1

728x90
[HTML]라이트모드, 다크모드 이미지를 picture에 미디어(media)쿼리로 다른이미지 불러오기 다크모드나 해상도에 따라 이미지를 다르게 보여줄때 유용하게 사용됩니다. 간단히 설명을 드리자면 source media는 css에 미디어쿼리와 동일하다고 생각하시면 됩니다. 아래 내용을 참고하셔서, 라이트/다크 모드일때 보여지는 이미지와, source 아래 기본 이미지를 넣으시면 됩니다. 반응형(해상도별) 예시 @media screen and (max-width:921px) { } (해상도 예시) 디바이스(운영체제별) 라이트, 다크모드 @media (prefers-color-scheme: dark) { } (디바이스 다크모드 예시)
반응형