<div>標簽是HTML中常用的標簽之一，用于定義一個容器，可以包含其他HTML元素。在使用<div>標簽創(chuàng)建一個容器時，我們可以控制它的大小，包括寬度和高度。對于包含圖片的<div>，我們也可以調整圖片的大小。在本文中，我們將詳細介紹如何使用HTML和CSS來控制<div>容器中圖片的大小。
，我們來看一個簡單的代碼案例，展示如何通過給<div>添加一個class，并使用CSS來設置圖片的大小。

<p>HTML部分：</p>
<div class="image-container">
<img src="image.jpg" alt="示例圖片">
</div>
<br>
<p>CSS部分：</p>
<style>
.image-container img {
width: 200px;
height: 150px;
}
</style>

以上代碼中，我們在<div>標簽上添加了一個class名為"image-container"。然后，我們在CSS部分使用".image-container img"選擇器來選擇<div>中的圖片，并設置其寬度為200像素，高度為150像素。
接下來，我們來介紹另一種方法，使用CSS指定<div>的寬度，并設置圖片的寬度為100%來使其自適應<div>的大小。

<p>HTML部分：</p>
<div class="image-container">
<img src="image.jpg" alt="示例圖片">
</div>
<br>
<p>CSS部分：</p>
<style>
.image-container {
width: 500px;
}
<br>
.image-container img {
width: 100%;
height: auto;
}
</style>

在這個例子中，我們在CSS部分指定了<div>的寬度為500像素。然后，在".image-container img"選擇器中，我們將圖片的寬度設置為100%。這樣，圖片的寬度將自動適應<div>的大小，圖片的高度則按照比例進行調整。
除了使用CSS來設置圖片的大小，我們還可以直接在HTML中設置圖片的寬度和高度屬性。

<p>HTML部分：</p>
<div class="image-container">
<img src="image.jpg" alt="示例圖片" width="200" height="150">
</div>

在上述代碼中，我們在<img>標簽中直接設置了圖片的寬度為200像素，高度為150像素。
通過以上幾個代碼案例，我們了解了如何通過CSS和HTML來設置<div>容器中圖片的大小。通過調整寬度和高度，我們可以根據(jù)需要來適應不同的布局要求。記住，在設置圖片大小時，可以考慮圖片的原始大小和<div>容器的大小來進行調整。希望本文對您有所幫助！</div>