盒子圖片在網頁設計中非常重要，能夠為網頁增添美感和藝術氛圍。為了實現盒子圖片效果，我們需要編寫一些CSS代碼。下面就是盒子圖片的CSS代碼：

.box-img {
position: relative;
width: 300px;
height: 200px;
}
.box-img:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('圖片地址');
background-size: cover;
opacity: 0.5;
z-index: -1;
}

以上代碼使用了偽類:before來為盒子添加一張背景圖片，其中content屬性為空，利用絕對定位讓圖片始終處于盒子的上層，而opacity屬性則調整圖片的透明度，background-size屬性設置圖片大小以適應盒子。同時，在盒子CSS類中增加難聞和允許相對定位，以適應任何位置的需求。 以上就是盒子圖片的CSS代碼，可以讓我們在網頁設計中輕松實現盒子圖片效果。希望這篇文章能對你有所幫助。