CSS中,可以使用border
屬性將圖片和文字框起來,具體步驟如下:
1、為圖片和文字添加邊框樣式
在CSS中,可以使用border
屬性為圖片和文字添加邊框樣式,可以為圖片添加實(shí)線邊框:
img { border: 1px solid #000; }
同樣地,也可以為文字添加邊框樣式:
p { border: 1px solid #000; padding: 10px; }
2、合并圖片和文字
需要將圖片和文字合并在一起,可以使用position
屬性實(shí)現(xiàn):
div { position: relative; width: 200px; height: 200px; } img { position: absolute; top: 0; left: 0; } p { position: absolute; top: 30px; left: 30px; }
在上面的代碼中,div
元素作為容器,img
和p
元素分別定位在容器的不同位置,通過調(diào)整top
和left
屬性,可以***地控制圖片和文字的位置。
3、添加背景色和邊框顏色
為了讓圖片和文字更加突出,可以為容器添加背景色和邊框顏色:
div { background-color: #f0f0f0; border: 1px solid #000; }
這樣,圖片和文字就會被一個(gè)帶有背景色和邊框顏色的容器所包圍。
通過以上步驟,可以使用CSS將圖片和文字框起來,并且控制它們的位置和樣式。