本文目錄導(dǎo)讀：

1. 引入圖片
2. 調(diào)整圖片大小
3. 圖片位置調(diào)整

CSS在文本框中添加圖片并調(diào)整圖片大小的方法

引入圖片

在CSS中，我們可以使用背景圖像屬性（background-image）將圖片添加到文本框中。

.text-box {
  background-image: url('image.jpg');
}

上述代碼將圖片image.jpg作為背景圖像添加到類名為.text-box的元素中。

調(diào)整圖片大小

添加圖片后，我們可以使用背景尺寸屬性（background-size）來調(diào)整圖片大小。

.text-box {
  background-image: url('image.jpg');
  background-size: 50px 50px; /* 調(diào)整圖片寬度和高度為50px */
}

還可以使用百分比或cover等關(guān)鍵詞來調(diào)整圖片大小，以適應(yīng)不同的布局需求。background-size: cover;將使圖片覆蓋整個(gè)元素，而不考慮其原始大小。

圖片位置調(diào)整

在文本框中添加圖片時(shí)，我們還需要考慮圖片在文本框中的位置，可以使用背景位置屬性（background-position）來調(diào)整圖片的位置。

.text-box {
  background-image: url('image.jpg');
  background-size: 50px 50px;
  background-position: center center; /* 圖片居中顯示 */
}

通過CSS的背景圖像屬性、背景尺寸屬性和背景位置屬性，我們可以輕松地在文本框中添加圖片并調(diào)整其大小，這種方法不僅簡(jiǎn)單易用，而且可以適應(yīng)不同的布局需求，使網(wǎng)頁(yè)更加美觀和富有交互性，在實(shí)際開發(fā)中，我們可以根據(jù)具體需求靈活使用這些屬性，以實(shí)現(xiàn)更好的視覺效果。