这些图像保持了它们的常规大小，即使我试图调整它们的大小以适合这些容器。 抱歉，如果这是愚蠢的，我仍然是相当新的网页设计。 但在我不思考之前，我没有遇到过任何问题，所以我不确定为什么会发生这种情况？ 我试过宽度和最大宽度，似乎都不适合我。

null

body {
    background:#222;
    color:#111;
    font-family:"Arial";
    font-size:14px;
    text-align:center;
}


#wrapper {
    width:1000px;
    margin:100px auto;
}


#container_left {
    background:#fff;
    font-size:15px;
    padding:10px;
    width:200px;
    height:auto;
    text-align:center;
    float:left;
    border: 2px dashed red;
}


.#container_left img {
    max-width:100%;
}


#big {
    background:#fff;
    font-size:20px;
    padding:10px;
    width:400px;
    height:auto;
    text-align:center;
    float:left;
    border: 2px dashed red;
    margin:0 50px 0 50px;
}


#container_right {
    background:#fff;
    font-size:15px;
    padding:10px;
    width:200px;
    height:auto;
    text-align:center;
    float:left;
    border: 2px dashed red;
}


.image_container {
    margin:10px 10px 10px 10px;
}


.image {
    width:190px;
    height:auto;
}

<div id="container_left">
    <div class="image_container">
    <div class="image"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/Image_created_with_a_mobile_phone.png/1200px-Image_created_with_a_mobile_phone.png"/></div>
    </div> <!-- image container -->
</div> <!-- container left -->

<div align="center">
<div id="big">

    <h2>welcome to my website!</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>

</div> <!-- big -->
</div> <!-- center -->

<div id="container_right">
    <div class="image_container">
    <div class="image"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/Image_created_with_a_mobile_phone.png/1200px-Image_created_with_a_mobile_phone.png"/></div>
    </div> <!-- image container -->
</div> <!-- container right -->

null