【網路行銷】影片嵌入我的網站時，如何讓影片寬度正好符合瀏覽器寬度呢？

當你想在自己的網站(部落格)裡嵌入YouTube影片時，可能會遇到以下問題，從YouTube抓取的<iframe>程式碼確實可以在你的網站上播放，但小小的…像這樣：

這時在桌機上雖然看起來小，但在手機上其實效果是很不錯的，像下面這樣：

但有沒有可能利用一段語法，就讓所有瀏覽器都可以滿版地看到這個影片呢？有的！

請把下面這段程式放在你自己的網頁裡：

----------------我是分隔線----------------

<style>
.embed-container 
{ position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, 
.embed-container object, 
.embed-container embed 
{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
</style>
<div class='embed-container'>
<iframe src='https://www.youtube.com/embed/qYOASiT6qD8?rel=0' autoplay='1' frameborder='0' allowfullscreen>
</iframe>
</div>

----------------我是分隔線----------------

其中qYOASiT6qD8這段請改成你要嵌入的YouTube代碼！

至於怎麼取得這段代碼呢？

第一步，在 YouTube 上找到你要嵌入的這段影片：

第二步，按「分享」：

按「分享」之後，畫面會變成像下面這樣：

第三步，把紅色框框裡的文字複製起來，截取最後面的那段代碼

用這段代碼取代掉上面程式碼中紅色那段文字，存檔後發佈即可！

以上三個步驟完成之後，網頁會變成像下面這樣：

有沒有覺得很滿意呢~~~