在網頁設計中，CSS技術是非常重要的一項技術。其中一個非常有趣的應用是在網頁背景上加上文字。這樣的效果可以讓網站看起來更加生動有趣，同時還可以起到宣傳、提示等作用。

CSS中的background屬性可以用來設置背景，我們可以利用這個屬性來為一個元素設置背景圖像，同時設置背景圖像的位置和重復方式。CSS還提供了opacity屬性來設置背景的透明度，讓背景更加美觀。

.pagediv {
background-image: url('bg.jpg');
background-position: center;
background-size: cover;
background-repeat: no-repeat;
opacity: 0.5;
}

上面的代碼中，我們使用了一個css類“pagediv”，將背景設置為bg.jpg，并設置了背景圖像的位置、重復方式、透明度等值。這樣，在網頁中使用這個類的div元素就可以有一個帶有背景圖像的背景了。

但是我們還要在背景上添加文字。這個時候，可以利用CSS中的偽元素:before和:after來實現。

.pagediv:before {
position: absolute;
content: "這是一段背景文字";
font-size: 48px;
color: white;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

上面的代碼中，我們為類“pagediv”添加了一個:before元素。通過設置position屬性，將文字絕對定位在背景上。通過設置content屬性，將文字內容設置為“這是一段背景文字”。通過設置font-size屬性，設置文字大小。color屬性設置文字顏色。通過設置top和left屬性將文字定位在中心。最后使用transform屬性來微調文字的位置，使文字居中水平、垂直居中。

通過上面的兩段代碼，我們可以實現一段帶有背景圖像和背景文字的頁面效果。如果要實現更加豐富、多彩的頁面效果，我們還可以嘗試修改代碼，增加其他樣式。