嵌入YouTube IFrame的響應

我嵌入的YouTube影片上的Magento網站下面的鏈接（Magento的並不重要，除非有我不知道的一個插件）嵌入YouTube IFrame的響應

<iframe width="640" height="360" src="http://www.youtube.com/embed/Zq-805aUM7M?feature=player_embedded" frameborder="0" allowfullscreen></iframe>

我不相信這一段代碼很好，因爲它沒有響應。我該如何解決？

2015-07-19 user829174

只是一個建議：http://getbootstrap.com/components/#responsive-embed 你只需要響應嵌入的CSS。 – nstungcom

嘗試這種純css方式：

iframe, object, embed { 
     max-width: 100%; 
     max-height: 100%; 
}

如果不行試試這個

2015-07-19 15:32:54

我會嘗試，請注意，我仍然希望它的寬度=「640」高度=「360」默認的大小開始 – user829174

它將@ user829174讓我知道它是否工作 –

yeap，解決了我的問題，謝謝！ – user829174

要特別目標YouTube視頻，並嵌入的不是所有的I幀或對象，您可以使用基於src中的字符串的屬性選擇器。

iframe[src*=youtube] 
{ 
    max-width:100%; 
    height:100%; 
}

這對我的作品，但無論如何，here you can find more solutions附加（具體）情況下

2015-10-13 10:28:54

有大量的提示在Web上提供建議刪除「寬度」和「高度」屬性，這是不可能的在某些情況下。但是，用戶可以覆蓋這些屬性與CSS

.wrapper { 
    position: relative; 
    height: 0; 
    overflow: hidden; 
    padding-bottom: 56.25%; }

面和iframe：「重要的」

.wrapper iframe[width][height] { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100% !important; 
    height: 100% !important; }

公告的[寬度]和[高度]在CSS選擇器和指令 - 這些都是必不可少的覆蓋iframe的寬度和高度屬性的值。

2016-11-21 13:56:55

回答