본문으로 바로가기

티스토리 유튜브 영상 삽입

category Media 2016. 3. 21. 15:31
반응형

티스토리 등.. XE게시판이나.. 유튜브 영상 삽입하기.


<style type="text/css">

.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: 95%;position: absolute; top: 0;left: 0; }

</style>

<div class="video-container">

  <object type="text/html" width="560" height="315" data="//www.youtube.com/embed/M5xEVpPReTM" allowFullScreen></object>

</div>


여기서 바꿀부분은 이 빨간값이다. 

data="//www.youtube.com/embed/M5xEVpPReTM



유튜브 영상에서 영상재생시 우클릭 소스복사를 하면

https://youtu.be/M5xEVpPReTM?list=PLPm8QCOWQknrmcLZrkVQkTrgjglak9XHw

이와 같이 나오는데 여기서 파란색 이 값을 복사해서 위에 넣어주면된다.

그리고 위 내용을 전체 복사해서 외부컨텐츠클릭해서 넣어주면됨.

모바일에서도 100% 가로 차지하며 보여준다.

반응형