부트스트랩을 통해 이미지 적응을 쉽게 구현할 수 있습니다.
<img src="..." class="img-responsive" alt="Pic">
부트스트랩을 참조할 계획이 없다면 순수 CSS를 통해 부트스트랩에서 img 반응형 클래스의 정의를 볼 수 있습니다.
.img-responsive {
display: inline-block;
height: auto;
max-width: 100%;}이런 식으로 순수 CSS를 사용하여 이미지 적용을 완료했습니다.
코드 설명: 디스플레이를 사용하면 이미지를 제한된 형태로 표시할 수 있으며 너비와 높이를 설정할 수 있습니다.
그런 다음 max-width를 사용하여 설정합니다. 다른 클래스 쌍을 포함할 수 있는 너비 태그의 너비 속성, 높이를 설정하면 이미지의 적응성이 높아지고 반대로 설정할 수도 있지만 일반적으로 이런 일이 더 자주 발생합니다.
위 내용은 적응형 이미지 크기를 달성하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
