在您嘗試關閉之前：我知道那里有類似的問題和答案，但是這些解決方案都不適合我，而只是將滾動鎖定在一起。這可能是因為我使用的是 w3schools 的網站模板。
我正在為一個學校專案制作一個網站，我希望背景是樹葉的圖片。不幸的是，這張圖片似乎沒有覆寫整頁，導致它向下重復。這是一個問題。
我曾經background-attachment: fixed;在 chrome (for windows) 上解決過這個問題，但發現 safari 不支持這個。
可以訪問該網站的代碼：here。（Control U 為頁面源）
tldr; 我需要找到background-attachment: fixed;適用于我的網站的 safari等效項。
提示：您必須在 safari 中測驗頁面才能看到問題。
uj5u.com熱心網友回復：
在這種情況下，由于 Safari 附件修復問題，您無法將背景保留在實際身體上。
但是，您可以將背景放在偽元素上，然后使用“普通”CSS 固定位置，這樣即使向下滾動也能保持原位。
這是一個基本示例：
body {
width: 100vw;
height: 200vh;
margin: 0;
padding: 0;
}
body::before {
content: '';
position: fixed;
width: 100vw;
height: 100vh;
background-image: url("https://hdwallsource.com/img/2014/5/green-background-21874-22427-hd-wallpapers.jpg");
background-size: cover;
z-index: -1; /* added */
}注意：背景大小設定為覆寫，因此無論縱橫比如何都覆寫整個視口（某些 img 可能會在頂部/底部或側面被裁剪以使其適合）。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/350453.html
上一篇：顯示選定下拉串列中的值