溢出隱藏影響圖像在突出主題中的位置如何？

這突出主題：http://themenectar.com/demo/salient-frostwave/溢出隱藏影響圖像在突出主題中的位置如何？

的問題是非常簡單的，但由於某些原因，我只是不明白的CSS規則相結合，使這件事情發生。當然還有其他方法可以做到這一點，但在這一點上，這讓我瘋狂，我無法弄清楚。

如果我從.video-wrap類中刪除overflow：hidden，則滑塊中的視頻向下移動，同時如果溢出：隱藏存在，它將向上移動。

有什麼讓我驚訝的是溢出：隱藏屬性完全可以影響元素的位置？

在此先感謝。希望這是一個簡單的問題，我只是很愚蠢。

來源

2017-02-07 Viktor

哇，你讓我很興奮太:)

因此，答案是非常簡單的。雖然網站似乎部分使用背景圖片，但您在加載網站時看到的實際上只是視頻元素，而不是img元素。因此，overflow：hidden隻影響視頻。我的猜測是該圖像是某種後備。嘗試刪除該視頻元素，看看你會得到什麼？

你可以在這裏看到視頻：

http://43eb74ada891f0f09679-c04bb4ac5bb47a13c85d2a60607693e6.r18.cf2.rackcdn.com/compressed/mountains2_converted.webm?id=4365

來源

2017-02-07 23:30:10 Sandro

對不起，我說的是視頻，而不是圖像。當然，圖像是手機的後備。但爲什麼和如何溢出影響視頻元素的位置對我來說仍然是一個謎。基本上，如果我模仿這個視頻元素的行爲，我最終有一個動態位置頂部，因爲如果我只是設置頂部位置靜態爲-100px例如，在較小的寬度屏幕上，因爲我猜尺寸和比例改變，然後視頻也去很多上漲或下跌，但在他們的例子中，它保持不變。他們沒有動態的位置，而是它以某種方式完成溢出和位置... – Viktor

哦，這對我來說有點太複雜。我發現的所有內容都是溢出的：隱藏設置整個視頻在視頻轉換元素中居中。沒有溢出：隱藏它位於頂部，造成的影響。這是有道理的，但由於某種原因，我無法重現它... – Sandro

我明白了。無論如何感謝您的嘗試=）。我有點放棄了，並且在動態位置頂端做到了。也許有一天有人會向我解釋這個魔法。 – Viktor

溢出隱藏影響圖像在突出主題中的位置如何？

回答

相關問題