在</head>前面加入Javascript

痞客邦的話加在

<script type="text/javascript">

$(document).ready(function () {

$('iframe[src*="youtube.com"]').wrap('<div class="youtubecontent" />');

});

</script>



在CSS樣式最後加入以下

 

.youtubecontent{

position: relative;

padding-top: 30px; height: 0; overflow: hidden;

}

.youtubecontent{

padding-bottom: 56.25%;

}

.youtubecontent iframe,

.youtubecontent object,

.youtubecontent embed {

position: absolute;

top: 0;

left: 0;

width: 100%;

height: 100%;

}

 

再從YouTube複製影片嵌入的編碼,貼入文章後就會隨著視窗改變大小了!

 

延伸閱讀.png

【教學】CSS語法・將圖片做成超連結

 


如果想持續看到新分享

歡迎到 Facebook 粉絲專頁點讚

有新的文章分享就會更快看到囉~

 

如果喜歡我的文章和分享

也歡迎支持一下我畫的 原創貼圖-歐告狗勾 喔!

代幣50 只要台幣30元

你的小小支持,就是我繼續分享的最大動力!  請點此購買

(電腦版使用者請點此看 較大的貼圖

手機版使用者點下圖,即可直接看到)

 

 

 

 

 


創作者介紹
創作者 司馬宏達 的頭像
司馬宏達

司馬宏達 ll 帶著宏達去旅行

司馬宏達 發表在 痞客邦 留言(0) 人氣()