모바일 사이트의 다른 기기 너비의 이미지 크기

Question

모바일 사이트의 경우 서로 다른 기기에서 어떻게 이미지 크기를 관리하나요?

Answer 1

응답 설계 중 하나는 답변입니다. 나는 그것을 따라 생각) CSS - how to make responsive images

Answer 2

를,이 사이트 주위를 살펴보고, 여기에 개념을 여기에 http://en.wikipedia.org/wiki/Responsive_web_design

물론 제작 http://css-tricks.com/which-responsive-images-solution-should-you-use/

반응 이미지에 대한 아주 좋은 게시물입니다에 대한 자세한 내용을보실 수 있습니다 당신이하고있는 일에,하지만 그것을하는 것 중 하나는 이미지를 컨테이너에 넣은 다음 그 너비의 퍼센트로 만드는 것입니다. 예를 들어

:

<div id="myContainer"> 
<img id="myImage" src="myImage.jpg"> 
<div> 

는 그런 다음 CSS는 수 :

다음

#myImage { width: 50%; } 

는 항상 반응 디자인, 100 % 수 있습니다, myContainer의 폭의 50 %가 될 것입니다 데스크톱 브라우저 용으로 설정된 최대 너비의 뷰포트 또는 CSS 미디어 쿼리로 설정할 수 있습니다.

현대적인 장치 브라우저는 높이가 결정되는 한 결정된 너비에 비례하여 설정합니다.