盡管有 css 代碼，但圖像並未在整個屏幕上顯示

Question

在我的網站上，我想用圖片完全覆蓋一個頁面（不是主頁）。 它應該完全填滿每台設備的屏幕。 我專門創建了一個子主題來處理這個問題。

在我的網站上，我想創建一個畫廊設施，用整個屏幕上的圖片來迎接訪問者。 如前所述，我為它創建了一個子主題。 我第一次嘗試在functions.php文件夾中將內容寬度設置為100%。 不幸的是，這沒有奏效。 然后我在我的 wordpress 主題上的所有自定義 css 字段上進行了嘗試。 那也沒有用。

 `element.style { background-image: url(https://philippfalkenhagen.de/wp-content/uploads/2019/10/Reh-im-Mohnfeld-Startseite-1.jpg); max-width: 100%; height: 801px; width: 100%; }

使用此代碼，它實際上應該是我想要的 funkitoinieren。 不幸的是，我無法將其集成到我的數據中。 他不適合functions.php 。php 並且他也不能作為自定義 css 工作。

// set default content width if (; isset( $content_width ) ) { $content_width = 680; }

functions.php文件夾中的這段代碼是我的第二次嘗試。 我無法將寬度設置為 100%，而在所有其他值上，她看起來都一樣。

我希望philippfalkenhagen.de/tiere-2`下的圖片填滿整個屏幕。 不幸的是，事實並非如此。 當我使用 100% 的第二個代碼時，我什至無法訪問我的網站，直到我重置代碼。

Answer 1

由於您處理的是背景而不是圖形本身，因此請嘗試使用background-size: 100% 100%和background-repeat: no-repeat 。

 `element.style { background-image: url(https://philippfalkenhagen.de/wp-content/uploads/2019/10/Reh-im-Mohnfeld-Startseite-1.jpg); max-width: 100%; height: 801px; width: 100%; background-repeat: no-repeat; background-size: 100% 100%; }

Answer 2

background-size: cover; 

將幫助您解決此問題。

更新：

`element.style {
   background-image: url(https://philippfalkenhagen.de/wp-content/uploads/2019/10/Reh-im-Mohnfeld-Startseite-1.jpg);
   max-width: 100%;
   height: 801px;
   width: 100%;
   background-size: cover; 
}

Answer 3

這是我的函數。php 文件夾：

https://we.tl /t-g7Mvc2EbC6

我懷疑我必須把代碼放在這里，但我不知道在哪里。