background-size：封面導致背景圖片被部分隱藏

Question

我正在嘗試做一個簡單的登錄頁面，我有一個頁眉，內容div和背景圖片和頁腳。 我希望它具有響應性，因此為了保持大小，我使用了background-image:cover 。 現在的問題是，在不同的屏幕上，圖像需要放大得如此之大，以至於隱藏了一部分，就像這樣：

如您所見，部分文本被剪切。 有什么主意嗎？

Answer 1

正如BenM所說，您必須在

1）扭曲圖像

2）使用封面剪裁

3）使用容器在側面留出空白。

但是，如果您的問題主要是必須始終顯示圖像的底部，則可以將background-position-y設置為：100％;

這將確保始終顯示圖像的底部（但頂部會切得更多...）