[CSS] Youtube유튜브 영상(iframe)을 모바일기기에 맞게 출력하기(반응형)

<iframe> 태그의 바깥에 <div class="videowrapper"> 로 감싼다.

/* CSS */
.videowrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 비율인 경우 */
  /* 4:3 비율인 경우 75%로 설정합니다 */
  padding-top: 25px;
  height: 0;
}

.videowrapper > iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}