使用CSS調整圖片和文字位置

CSS（層疊樣式表）是一種用于樣式化網頁的語言。它可以用來設置網頁的布局、顏色、字體樣式等等。在網頁開發中，我們經常需要調整圖片和文字的位置。下面是在CSS中如何調整圖片和文字位置的介紹。

調整圖片位置

在CSS中，我們可以使用float屬性來調整圖片的位置。該屬性有三個取值：左、右和無。默認值為無。例如：

img {
float: left;
}

該代碼片段會將圖片向左浮動。

調整文字位置

在CSS中，我們可以使用text-align屬性來調整文字的位置。該屬性有四個取值：左、右、中和對齊。例如：

p {
text-align: center;
}

該代碼片段會將段落中的文字居中對齊。

調整圖片和文字的位置

有時候，我們需要同時調整圖片和文字的位置。為了實現這一目的，我們可以將圖片包裹在一個容器中。例如：

<div class="container">
<img src="image.jpg">
<p>這是一段文字。</p>
</div>

然后，我們可以使用display和margin屬性來調整容器中圖片和文字的位置。例如：

.container {
display: inline-block;
}
.container img {
float: left;
margin-right: 10px;
}
.container p {
text-align: left;
}

該代碼片段會將圖片向左浮動到段落的左側，同時在圖片右側留出10像素的空白。

總之，CSS可以實現豐富的布局效果，我們可以根據需要靈活使用這些屬性來調整圖片和文字的位置。