Responsive은 layout 속성에서 제공하는 가장 유용한 속성 중 하나입니다. Responsive 레이아웃을 사용하는 경우 width 및 height 속성을 지정해야 합니다.
<amp-img src="sample.jpg"
width="1280"
height="720"
layout="responsive" >
</amp-img>
그냥 뷰포트에 맞게 늘어나거나 줄어들면 되는 거 아닌가요?라고 물을 수 있지만 너비와 높이 속성이 필요한 이유는 두 가지가 있습니다.
이미지의 가로 세로 비율을 계산하기 위해.
이미지의 크기가 조정될 때 올바르게 표시되도록 가로 세로 비율을 계산하기 위해 필요합니다. 예를 들어16:9 비율의 이미지를 사용하는 경우, 가로 세로 비율만으로 다음과 같이 작성할 수 있습니다.
<amp-img src="sample.jpg"
width="16"
height="9"
layout="responsive">
</amp-img>
사전에 페이지의 레이아웃을 계산하기 위해.
이미지를 다운로드하기 전에 AMP의 정적 레이아웃 시스템에서 페이지의 레이아웃을 계산하려면 width와 height 속성이 필요합니다.
