当浏览器调整大小时图像溢出容器

我已经开始设计一个网站，并且我已经使用了一个封装器来定位我的信息和图像。我已经将第一张图片添加到包装中，并且当浏览器变大时它看起来很棒。当浏览器调整大小时图像溢出容器

但是，当我调整浏览器的大小时，图像（这是一个穿过页面的链）移出包装的每一边。

理想情况下，我想改变它，以便在浏览器调整大小并在页面上滚动时，链条保持在包装内。

body { 
    background-color:#2791ce; 
    background-image:url(../img/images/lightblue_02.jpg); 
    background-size:98%; 
    background-repeat: repeat-y; 
    background-position:center; 
} 

#wrapper { 
    width:1174px; 
    margin-left:auto; 
    margin-right:auto; 
    position:relative; 
    padding-bottom:350px; 
} 

#logo { 
    position:relative; 
    padding-left:6%; 
    margin-left:auto; 
    margin-right:auto; 
} 

#chain { 
    position:relative; 
    margin-left:auto; 
    margin-right:auto; 
    padding-top:5%; 
}

<html> 
</head> 
<body/> 
<div id="wrapper"> 
    <div id="logo"> 
     <img src="img/images/skip.png"/> 
    </div> 
    <div id="chain"> 
     <img src="img/images/images/images/Untitled-1_02_02.png" width="1174" height="32" /> 
    </div> 
</div>  
</div> 
</body> 
</html> 
<html>

来源

2012-12-23 please delete me

这个网站在线，我们可以在哪里查看并查看您的问题？ –

我想你在页面上使用了太多的CSS – underscore

如果你想保持纵横比，尝试添加这些行到你的形象。我正在考虑img成为你的形象的一部分。

.img { 
max-width:<max-width of your parent div> 
max-height:<max-height of your parent div> 
}

如果要缩放图像，请插入以下代码。

.img { 
width:100%; 
max-width:100%; 
display:block; 
height:100%; 
max-height:100%; 
}

来源

2012-12-23 20:34:40

当浏览器调整大小时图像溢出容器

回答

相关问题