적응형 이미지 크기를 달성하는 방법

이미지 크기 적응

부트스트랩을 통해 이미지 적응을 쉽게 구현할 수 있습니다.

<img src="..." class="img-responsive" alt="Pic">

부트스트랩을 참조할 계획이 없다면 순수 CSS를 통해 부트스트랩에서 img 반응형 클래스의 정의를 볼 수 있습니다.

.img-responsive {    
    display: inline-block;    
    height: auto;    
    max-width: 100%;}

이런 식으로 순수 CSS를 사용하여 이미지 적용을 완료했습니다.
코드 설명: 디스플레이를 사용하면 이미지를 제한된 형태로 표시할 수 있으며 너비와 높이를 설정할 수 있습니다.
그런 다음 max-width를 사용하여 설정합니다. 다른 클래스 쌍을 포함할 수 있는 너비 태그의 너비 속성, 높이를 설정하면 이미지의 적응성이 높아지고 반대로 설정할 수도 있지만 일반적으로 이런 일이 더 자주 발생합니다.

위 내용은 적응형 이미지 크기를 달성하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!