今天我想跟大家分享的是如何在CSS彈框中加入圖片。彈框是網頁設計中非常常用的元素, 可以實現許多有趣、實用的效果。當我們需要在彈框中展示一張圖片的時候，又該如何實現呢？下面就讓我來為大家詳細講解一下。

首先，我們需要一個基本的彈框框架。下面是一個簡單的CSS彈框樣式：

.pop-up {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 999;
background-color: #ffffff;
width: 400px;
height: 400px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

接下來，我們需要在這個彈框上添加一張圖片。我們可以使用HTML的img標簽來實現。代碼如下：

<div class="pop-up">
<img src="img/picture.jpg" alt="圖片">
</div>

這樣，我們就在彈框中添加了一張名為"picture.jpg"的圖片。但是，我們還需要對這張圖片進行一些樣式的修飾。比如，使這張圖片居中顯示。

.pop-up img {
max-width: 100%;
max-height: 100%;
display: block;
margin: 0 auto;
}

上述代碼中，我們對img標簽應用了一些CSS樣式。max-width和max-height設為100%可以使圖片在彈框中自適應大小。display:block可以規定img標簽作為塊級元素來顯示，從而使其在水平方向上居中。margin: 0 auto可以使其在垂直方向上居中。

好了，這樣我們就成功的在CSS彈框中加入了一張圖片！