HTML CSS圖像自適應網站

-5

嘿，我試圖讓一個負責任的網站，當我改變屏幕的尺寸爲背景的變化大小的圖像脫落底部和變化垂直位置。幫助將不勝感激。

<div class="imagess"> 
    <img style="margin-left: 400px; margin-top: -103px; " src="images/Phone.png"/> 
</div> 
.imagess { 
    position: relative; 
    width: 100%; /* for IE 6 */ 
}

來源

2016-11-12 user3428516

請提供直播環節，所以，我可以檢查，什麼是真正的問題 –

爲什麼我就在這-4？ – user3428516

沒有人理解你的問題。：D –

你可以利用css calc()功能的設置元素的頂部位置如下。

.imagess { 
 
    position: relative; 
 
    width: 100%; 
 
    height:800px; 
 
    overflow:hidden; 
 
    background:#111; 
 
} 
 
.imagess > img{ 
 
    position:absolute; 
 
    width:200px; 
 
    height:300px; 
 
    right:0; 
 
    top:calc(100% - 90%); 
 
}

<div class="imagess"> 
 
    <img src="https://source.unsplash.com/random"> 
 
</div>

來源

2016-11-12 05:35:16 frnt

爲img標籤做一個類。這是使img響應的CSS。我只是對你的結構感到困惑.Coz圖像風格的邊緣保留和邊緣頂端讓我困惑。所以這只是一個例子。

.imagess { 
 
    position: relative; 
 
    width: 100%; /* for IE 6 */ 
 
} 
 

 
.img-responsive{ 
 
width:100%; 
 
height:auto; 
 
display:block; 
 
margin:0 auto; 
 
}

<div class="imagess"> 
 
    <img class="img-responsive" src="https://repairexpress.com/wp-content/uploads/2014/02/repair-express-vernon-samsung-galaxy-note-4.png"/> 
 
</div>

來源

2016-11-12 05:23:22

HTML CSS圖像自適應網站

回答

相關問題