유튜브 링크 화면 전체크기에 맞게 퍼오는 방법

포스팅 하다보면 유튜브 영상을 퍼올때가 있는데 유튜브링크를 그대로 가져오면 사이즈가 제각각이라 내 글쓰기 폼에 맞게 일일이 크기를 맞춰서 소스작업을 해야 합니다

너무 귀찮아서 일정한 크기로 자동으로 셋팅 되게 소스를 변경해서 집어 넣는 방법이 있어
공유합니다

물론 이 방법은 모바일에 반응형으로 크기가 자동으로 보여집니다







소스코드 

◐ 티스토리나 구글이나 css에 아래 코드를 넣어줍니다 

.video-container{position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden;}
.video-container iframe,.video-container object,.video-container embed{position:absolute;top:0;left:0;width:100%;height:100%;}

◐ 구글에서는 바로 원하는 유튜브 src 주소만 교체해서 포스팅할때 html을 바로 입력 

<div class="video-container">
    <iframe width="100%" height="315" src="//www.youtube.com/embed/voX7Wotmngs" frameborder="0" allowfullscreen></iframe>
</div>

---