CSS-背景圖像水平拉伸並垂直重復？
[英]CSS - Background image stretch horizontally and repeat vertically?
問題描述
使用background-size: cover我可以使背景拉伸以適合頁面的整個寬度。
使用repeat-y我可以使背景重復或垂直平鋪，直到頁面的整個高度。
有什么辦法可以結合這兩種效果？ 不幸的是，它們似乎無法協同工作（至少在Chrome中）。 看來我可以使用background-size: cover在兩個方向上拉伸，也可以不在x方向上拉伸，而在y方向上重復。
編輯：使用background-size: 100% Npx （其中N是圖像的高度）我可以完成上述操作，但是由於背景圖像僅沿一個方向拉伸，因此它使背景圖像傾斜。 有沒有辦法保持它按比例縮放？
1 個解決方案
解決方案1
19 已采納 2016-12-07 19:22:23
不用封面，而是使用background-size: 100% auto; 將背景圖片調整為完整的瀏覽器寬度，同時保持其高寬比。 與background-repeat: repeat-y;一起使用background-repeat: repeat-y; 垂直平鋪。
是否可以使背景圖像垂直重復。 但是，使用CSS也只是水平向右側？
[英]Is it possible to make a background image repeat vertically. But, also horizontally only to the right side using CSS?
獲取背景圖像或文本以填充寬度，不重復，但不垂直拉伸
[英]get background image or text to fill width, not repeat, but not stretch vertically
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.