在CSS中，文字與圖片的對齊方式是一個(gè)常見的需求，以下是一些常見的對齊方式及其實(shí)現(xiàn)方法：

1、頂部對齊：

- 圖片和文字的頂部在同一水平線上。

- 示例代碼：align-items: flex-start;

2、底部對齊：

- 圖片和文字的底部在同一水平線上。

- 示例代碼：align-items: flex-end;

3、居中對齊：

- 圖片和文字在容器中居中對齊。

- 示例代碼：align-items: center;

4、基線對齊：

- 圖片和文字使用基線進(jìn)行對齊。

- 示例代碼：align-items: baseline;

5、圖片左對齊：

- 圖片在文字的左側(cè)，文字從圖片下方開始。

- 示例代碼：float: left;

6、圖片右對齊：

- 圖片在文字的右側(cè)，文字從圖片下方開始。

- 示例代碼：float: right;

7、文字環(huán)繞圖片：

- 文字環(huán)繞圖片排列，圖片可以放在文字的左側(cè)或右側(cè)。

- 示例代碼：float: left; /* 或 right */

8、***定位：

- 使用***定位（absolute positioning）將圖片和文字***地定位在容器中。

- 示例代碼：position: absolute; /* top, right, bottom, left 屬性可調(diào)整位置 */

9、Flexbox：

- 使用Flexbox布局將圖片和文字進(jìn)行靈活的對齊。

- 示例代碼：display: flex; /* justify-content 和 align-items 屬性可調(diào)整對齊方式 */

10、Grid：

- 使用Grid布局將圖片和文字進(jìn)行二維的對齊。

- 示例代碼：display: grid; /* justify-content 和 align-items 屬性可調(diào)整對齊方式 */

這些對齊方式可以根據(jù)具體的需求和布局進(jìn)行調(diào)整，在實(shí)際應(yīng)用中，可以根據(jù)容器的類型（如div、section、article等）和具體的樣式需求選擇合適的對齊方式。