如何始終在HTML5中的iframe中顯示滾動條

有沒有辦法在HTML5中始終在iframe上顯示滾動條，即使內容不溢出？「scrolling="yes」屬性在HTML5中不起作用有沒有使用CSS的方法？如何始終在HTML5中的iframe中顯示滾動條

來源

2014-12-05 nparabz

我不太清楚，但我認爲設置CSS'overflow'屬性爲'scroll'會做到這一點 – redelschaap 2014-12-05 23:47:58

感謝您的回覆，但設置溢出滾動iframe標記不起作用。就像下面的答覆者所建議的那樣，在嵌入式文檔上設置body {overflow：scroll}可以使其工作。 – nparabz 2014-12-06 14:16:50

哦，是的，這是正確的，以及我在正確的方向，然後:) – redelschaap 2014-12-07 11:12:04

看來scrolling="yes"只被一些早期的瀏覽器所支持，從IE11舊版本的模擬來看，似乎IE8掉線支持：儘管屬性被識別，但值yes不是滾動條僅在內容不適合時才顯示。

這是瀏覽器慣例的變化，它與HTML5無關。實際上，HTML5 describes屬性scrolling="yes"作爲映射到CSS設置overflow: scroll，這有點誤導。

現代瀏覽器實現iframe，以便滾動條存在，如果需要訪問所有內容，則不會以其他方式訪問。使用scrolling=no或overflow: hidden，可以防止出現滾動條，但如果內容適合（不存在溢出），則不會顯示滾動條。

要使滾動條出現，您需要使嵌入式文檔對其進行設置，例如，通過在其中使用body { overflow: scroll }。那麼iframe元素說什麼都沒有關係。當內容實際適合時，滾動條將是被動的（並且是淺灰色的），但是它們將佔據空間，並且隨着內容擴展而變爲活動滾動條以致它不適合。在下面的例子中，我植入，設置body { overflow: scroll }並有一個可編輯body元素的網頁，讓您可以添加行，看看吧如何變化：

<iframe src="http://www.cs.tut.fi/~jkorpela/hello.html"></iframe>

來源

2014-12-06 11:31:36

完美的工作。謝謝你的詳細回覆。 – nparabz 2014-12-06 14:13:46

只是作爲一個附加如果你只想讓滾動條在一個方向上顯示，而不是你可以使用特定的y和x css。

我想要一個垂直滾動條顯示所有時間的外觀，但不是水平的，因爲寬度從未改變過。

所以我用：

{溢出-Y：滾動;}

另外一個（在這種情況下，溢出-X）將默認爲自動，只在需要時顯示。

來源

2015-01-26 22:43:36

如何始終在HTML5中的iframe中顯示滾動條

回答

相關問題