👉🏻반응형 이미지 비율 유지하기 바로 코드를 보면서 설명하겠습니다. padding-top에 calc을 사용해서 계산 식을 넣어서 비율 계산할수 있습니다. 참고: aria-label은 웹에 더 정확한 정보를 전달하기 위해서 사용하는 속성 & 스크린 리더를 통해 웹을 사용하는 사용자들에게 전달해야 하는 정보를 제공하고 싶을 때 사용합니다.!! 👉🏻유튜브와 같은 iframe 영상 비율도 유지 이번에는 유튜브와 같은 iframe 태그 영상 비율도 유지해보도록 하겠습니다.

유튜브(Youtube) 영상 비율에 마쳐 반응형으로 만들기 안녕하세요 TriplexLab 입니다. 오늘은 유튜브(Youtube) 영상 컨텐츠를 16:9비율에 마쳐 반응형으로 만드는 방법에 대해서 살려보도록 하겠습니다. 먼저 유튜브로 가셔서 퍼오고 싶은 영상를 퍼옵니다. 그리고 하단 처럼 수정합니다. ✍️ 유튜브 영상 비율 코드 padding-bottom 계산식은 height / width * 100 입니다. /* 비디오 컨텐츠를 16:9비율에 마쳐 반응형으로 만들기 */ .video {position: relative; margin: 0 auto; max-width: 900px; width: 100%;} .video > div{ width: 100%; padding-bottom: 56.25%;} /* p..