今日身體不適後面再修正
當您使用帶有 layout='fill' 的下一個圖像時,圖像將使用相對位置填充第一個父元素的空間。包含圖像的 div 具有相對位置,但沒有固定的寬度和高度。
1.它的寬度由父 'blocks' 網格元素決定,因為規則 grid-template-columns。列是關於寬度,而不是高度。
2.它的高度由h2.title和p.about的子div的高度決定。這就是它如此小而寬的原因。
在您的情況下,最好的解決方案是在具有相對位置的 div 上設置固定的高度和寬度,並使用各種分辨率的媒體查詢調整其值。給它一個 className 並設置 css 規則位置、寬度、高度,不要將內聯樣式與 css 文件中的樣式混合。