브라우저 너비가 감소하면 이미지 너비가 감소합니다.

Question

이미지가 왼쪽에 있고 내용 영역이 고정 너비 인 웹 페이지에 문제가 있습니다. 브라우저에서 너비를 줄이면 이미지 너비가 줄어들지 만 작게는 만들어지지 않습니다. 나는 그것을 왼쪽에서자를 것이다.

어떻게하면됩니까?

Answer 1

트릭

.image-left-of-content{ 
    background-size : contain; 
} 

Answer 2

안녕하세요 여기 내가 당신에게 예를을 할 것 이미지의 CSS에 다음을 추가, 당신은 .left의 DIV 컨테이너의 20 %와 왼쪽 사업부의 100 % 내부의 IMG을 당신은 페이지의 크기를 조정하는 경우 그래서이 작동합니다

HTML

<div class="container"> 
     <div class="left"> 
      <img src="...your image src"/> 
     </div> 
     <div class="right"> 
     content 
     </div> 
    </div> 

CSS

.container{width: 400px;} 
.left{width: 20%;} 
.left img{width: 100%;} 

Answer 3

질문을 올바르게 이해했다면 이미지 및 콘텐츠 영역에 백분율 너비를 설정해야합니다.

이 예제를 참조하십시오. http : //jsfiddle.net/0z063thv/