유용한 자료
< 자료공유 < 유용한 자료
기타자료실

css | 반응형 아이프레임

페이지 정보

작성자 madalla 작성일18-02-20 20:15 조회76회 댓글0건

본문

@media screen and (max-width: 600px) {
#content-view iframe { width: 100%; height: 200px; }
}

 

유투브

 

<style>
.video-container {
    margin: 0;
    padding-bottom: 75%;
    max-width: 100%;
    height: 0; 
    position: relative;
    overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
    margin: 0;
    padding: 0; 
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
</style>
 
<div class="video-container">
    <iframe ~~~></iframe>
</div>


 

  • 페이스북으로 보내기
  • 트위터로 보내기
  • 구글플러스로 보내기