html - 当窗口宽度变小时图像从容器中出来

Question

在 lg 或 md 等全屏模式下，它适合容器，但当我缩小窗口时，图像从容器中移出

这是用 Bootstrap 3 制作的 这是使用的 HTML 和 CSS:

<styles>
.CustomDiv
{
background-color: white;
margin: 6px;
min-height: 1000px;
text-align: center;
font-size: large;
border-radius: 3px;
padding: 0px;
}
.customImg
{
max-width: 1100px;
position: relative;
}
body
{
background: url("images/wood2.jpg") no-repeat;
}
body > nav > .container > .navbar-collapse > ul 
{
font-size: 15px; 
font-weight: 10;
font-family: 'Segoe UI';
letter-spacing: 1px;

}
body > nav > .container > .navbar-collapse > ul > li > a 
{
padding: 20px 30px;
}
.navbar .navbar-nav {
display: inline-block;
float: none;
vertical-align: top;
}

.navbar .navbar-collapse {
text-align: center;
}
</styles>

<nav class="navbar navbar-default">
<div class="container">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-target=".navbar-collapse" data-toggle="collapse">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
     </button>
  </div>
  <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="Pge2.html">Contact</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Products</a></li>
    </ul>
  </div>
  </div>
</nav>
<div class="container">
  <div class="row">
    <div class="col-xs-12 col-lg-12">
      <div class="CustomDiv">
      <br>
        <div class="container">
        <div class="customImg">
            <div id="imageCarousel" class="carousel slide carouselCustom" data-interval="2000">
                <div class="carousel-inner">
                    <div class="item active center-block">
                        <img src="images/Coffee.jpg" class="center-block img-responsive"/>
                    </div>
                </div>
          </div></div>
          </div>
      </div>
      </div>
    </div>
  </div>
</div>

Answer 1

通过以下方式使您的图片具有响应性:

height:auto;
width:100%;
max-width:1100px;

设置max-height是可选的。