我正在嘗試將影像添加到我的網站頁面以覆寫任何螢屏尺寸的整個頁面
*{
padding:0px;
margin:0px;
}
img {
width:100%;
object-fit:cover;
max-width: 100%;
min-height: 100%;
min-width: 100%;
}
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<div class="responsive">
<a href="#" ><img src="img/d.png"> </a>
</div>
該代碼適用于桌面,但對于移動設備,某些影像無法覆寫 100% 的螢屏寬度。
uj5u.com熱心網友回復:
body 應該有一些高度和寬度,以便影像從父級繼承高度。在單位中使用 % 表示相對于父級。因此,父元素也應該有寬度和高度。
body {
width: 100%;
height: 100vh;
}
.responsive {
width: 100%;
height: 100%;
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/493553.html
上一篇:如何在塊中顯示影像?