CSS를 사용하여 브라우저 크기에 따라 이미지 크기를 자동으로 조정하는 방법은 무엇입니까?

CSS를 사용하여 브라우저 크기에 따라 이미지 크기를 자동으로 조정

브라우저 창 크기를 조정할 때 이미지 크기가 자동으로 조정되기를 원하지만 제공된 코드 작동하지 않습니다. 해결책을 찾아보겠습니다.

이미지를 유연하게 만들려면 max-width: 100% 및 height: auto를 추가해야 합니다. 그러나 IE8에는 이것이 작동하지 않는 버그가 있습니다. 이 문제를 해결하려면 IE8에 width: auto\9를 추가하세요.

<code class="css">img {
    max-width: 100%;
    height: auto;
    width: auto; /* ie8 */
}</code>

img 태그를 사용하여 추가된 모든 이미지는 이제 자동으로 크기가 조정됩니다.

설명을 위해 다음은 img 태그를 사용하지 않는 JSFiddle의 예입니다. JavaScript가 필요하지 않습니다. 최신 버전의 Chrome, Firefox, IE와 호환됩니다(테스트 기준).

위 내용은 CSS를 사용하여 브라우저 크기에 따라 이미지 크기를 자동으로 조정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!