두 그림을 같은 높이로 만드는 방법은 무엇입니까?

Question

동일한 높이의 사진을 찍을 때 img width: 100%;을 만들 때 문제가 발생했습니다. 사진 높이가 같을 수 없습니다.

나는 이것이 쉬운 질문이라고 생각하지 않습니다.

왜 같은 높이의 그림을 브라우저 높이로 렌더링 할 수 없는지 이해할 수 없습니다.

여기가 jsfindle입니다.

the effect with no pictures

하지만 IMG에 사진을 넣을 때 SRC 상황이 나쁜 얻었다. 결국

, 나는 그것이 다른 장치뿐만 아니라 pc.But하지만 ...

내가 의아해,이 질문에 대한 점은 무엇 동일한 뷰를 만들까요?

Answer 1

예제에서 FRAME 높이를 35로 설정하면 div에서 다음 div로 변경되지 않습니다. CSS에서 이미지의 높이가 설정되어 있지 않지만 MAX-HEIGHT가 있으므로 높이를 변경할 수는 있지만 최대 높이를 초과하지는 않습니다. 너비와 동일하게 설정되지 않습니다.

html 태그의 높이를 변경하면 html이 이미지 크기의 제한을 유지합니다. 높이의 20 %를 제거하면 원하는 너비로 설정하지 않으면 자동으로 너비의 20 %가 제거됩니다.

이 시도 :

<div class="frame"> 
    <img src="http://jsfiddle.net/img/logo.png" height="250" width="250" /> 
</div> 
<div class="frame"> 
    <img src="http://jsfiddle.net/img/logo.png" height="25" width="250" /> 
</div> 

높이가 변경되지만, 폭은하지 않습니다. 물론 너비는 160px로 설정되어 있으므로이 HTML 코드가 250이라고해도 여전히 160을 넘지는 않을 것입니다.

나는 이것이 당신이 묻는 것이라고 생각합니다. 그렇다면 사과드립니다.