我想在塊的背景中顯示影像。我的問題是這張圖片是扭曲的（在寬度上拉伸）。
我不需要顯示整個影像，我希望它占據塊的整個寬度，但即使高度隱藏，它也必須以高度為中心。
例如，我希望它看起來像這樣：
https://cdn.pixabay.com/photo/2016/11/21/03/56/landscape-1844226_960_720.png
element.style {
background: url(https://cdn.pixabay.com/photo/2016/11/21/03/56/landscape-1844226_960_720.png);
background-position: center;
background-size: cover;
}
我不知道如何在img元素上應用相同的樣式。這是我的代碼：
.node--view-mode-similar .layout {
position: relative;
margin-bottom: 0;
padding: 1rem 1rem 0.2rem 1rem;
border: 2px solid #ced8dd;
}
在此處輸入影像描述
.node--view-mode-similar .block-field-blocknodearticlefield-article-image img {
position: absolute;
top: 0;
left: 0;
z-index: -1;
height: 100%;
}
在此處輸入影像描述
uj5u.com熱心網友回復：
嘗試使用這個：
object-fit: cover;
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/493552.html
上一篇：防止顯示未完全加載的影像
下一篇：覆寫整個頁面的回應式影像