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图像自适应网站

回答

相关问题