在網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中，經(jīng)常需要為圖片添加文字，CSS很好地滿(mǎn)足了這個(gè)需求。使用CSS可以直接在圖片上寫(xiě)字，而不需要事先在圖片上添加文字，這也方便了網(wǎng)頁(yè)設(shè)計(jì)師。

要實(shí)現(xiàn)在圖片上寫(xiě)字，首先需要將圖片作為背景圖，代碼如下：

.img-text {
background-image: url("example.jpg");
}

在圖片上添加文字可以使用"::before"或"::after"偽元素。下面是使用"::before"偽元素的代碼示例：

.img-text::before {
content: "這是一張圖片";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

在上述代碼中，"content"屬性定義了文字內(nèi)容，"position"屬性定義了偽元素的定位方式為絕對(duì)定位，"top"和"left"屬性將偽元素定位在圖片的中心，"transform"屬性將偽元素水平和垂直居中。

如果要調(diào)整文字的樣式，可以使用CSS中的其他屬性，例如"font-size"、"font-family"、"color"等屬性：

.img-text::before {
content: "這是一張圖片";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 24px;
font-family: Arial, sans-serif;
color: #ffffff;
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}

上述代碼中，"font-size"屬性設(shè)置了字體大小為24像素，"font-family"屬性設(shè)置了字體為"Arial"或sans-serif字體族中的任意一種，"color"屬性設(shè)置了文字的顏色為白色，"text-shadow"屬性定義了文字的陰影效果。

在使用CSS往圖片上寫(xiě)字時(shí)，需要注意的是要確保圖片和文字之間的對(duì)比度足夠大，不然文字可能會(huì)難以閱讀。