HTML : 동일한 너비의 이미지

Question

이미지를 3 개 (가로)로 배치하고 모두 동일한 너비의 페이지가 있어야합니다 (실제 이미지 크기는 다를 수 있음). 이미지 비율에 따라 이미지 높이를 변경할 수 있습니다. 제한이 없습니다.

너비 = 100 % [테이블 너비 = "100 %"] 인 테이블을 사용하고 있습니다. 그 테이블 안에는 3 개의 열 (td)이있는 행이 하나 있는데, 각각 33 % [td 스타일 = "너비 : 33 %;"]입니다. 각 테이블 설명에는 하나의 이미지가 있으며 이미지의 너비가 각 이미지의 80 %를 차지하도록 [img src = "{{MEDIA_URL}} a.jpg"80 % style = "width : 80 %;" 화면 너비의 1/3.

Mozilla에서는 잘 작동하지만 Chrome에서는 새로 고침을 할 때 이미지가 매우 작아 지지만 브라우저 URL을 입력하는 동안 이미지가 잘 작동합니다. 기본적으로 테이블 너비를 100 %로 취하지 않으므로 border 속성을 사용하여 계산할 수 있습니다.

의견이 있으십니까?

Answer 1

CSS 대신 html 대신 이미지 스타일을 적용 해 보셨습니까?

div를 수평으로 정렬하는 데 float 속성을 사용하면 각 div와 이미지에 비율을 적용 할 수 있습니다. 즉, 창의 크기가 변경 될 때 크기가 다시 조정됩니다.