具有線性漸變溢出的多個背景圖像

我的codepen使用包含線性漸變的第二個多重背景圖像顯示此介紹頁面背景圖像。問題是瀏覽器調整大小時圖像縮小，線性漸變保持高度不變。我如何動態改變梯度高度以匹配第一個背景圖像高度？具有線性漸變溢出的多個背景圖像

注：我不想使用background-size: cover，因爲它切斷了太多的圖像。

導航欄和背景圖像之間的身體差距（顏色：＃454545）似乎特別代碼。當我在本地運行網頁時，它不會顯示。

2017-02-22 Eggs

根據我的經驗，CSS在周圍環境發生變化時並不那麼靈活。我腦海中浮現出兩個解決方案。

2017-02-22 03:06:42

我會調查使用JavaScript創建多個媒體查詢添加內聯CSS。最終還會添加媒體查詢，因爲我希望顯示器既能夠響應又能夠自適應。 – Eggs

這是一個新的[codepen]（http://codepen.io/KerryRuddock/full/yMyXBN/），用於顯示基於圖像大小調整元素大小的JS。希望這可以幫助某人。 – Eggs

回答