在網頁設計中，HTML盒子作為最基本的單元，被廣泛使用。盒子的外觀和樣式一直是制作網頁時的焦點之一，而圖片在網頁設計中也是一個非常重要的元素，可以用于補充頁面內容、增加美觀度、傳達信息等多種作用。如何設置盒子內的圖片？以下是一些方法。

<div>
<img src=" " alt=" " width=" " height=" ">
</div>

以上是最基本的設置，將圖片放在一個div標簽里，使用img標簽引用圖片，通過設置圖片的屬性來控制圖片的大小，其中src表示圖片的文件路徑，alt表示圖片的替代文本，width表示圖片的寬度，height表示圖片的高度。

<div style="background-image: url(' '); background-repeat: no-repeat; background-size: cover;"></div>

如果需要將圖片作為盒子的背景，可以使用上述代碼，將圖片引用作為盒子的背景圖，使用background-repeat設置背景圖的重復策略，例如no-repeat表示不重復，使用background-size控制背景圖的大小，例如cover表示將背景圖縮放到盒子大小，且保持縱橫比。

<span></span>
<style>
span {
display: block;
width: 200px;
height: 200px;
background-image: url(' ');
background-position: center;
background-size: cover;
border-radius: 50%;
}
</style>

如果需要將圖片呈現為一個可調整大小的圓形頭像，可以使用上述代碼，使用span標簽來包裹背景圖，并設置span標簽為塊狀元素，使其可以設置寬度和高度，并使用border-radius屬性設置圓角半徑，使其呈現出圓形。另外，使用background-position屬性把背景圖放在盒子中心，使其保持垂直和水平的居中對齊。