CSS 是一種重要的 Web 設計語言，它可以通過各種方式對網站樣式進行調整和美化。其中，CSS 還提供了一種方便的方式給圖片加上文字，讓我們來學習一下如何實現。

/* HTML 代碼 */
這是一張美麗的海灘照片
/* CSS 代碼 */
.image-with-text {
position: relative;
}
.text-overlay {
position: absolute;
bottom: 0;
z-index: 1;
width: 100%;
background-color: rgba(0, 0, 0, 0.5);
padding: 20px;
color: #fff;
}
.text-overlay h2 {
margin: 0;
font-size: 24px;
}

在這個例子中，我們給圖片添加了一個懸浮在圖片上面的黑色半透明遮罩層，然后在遮罩層里添加了一個 h2 標簽來放置文字。通過改變遮罩層的樣式屬性，我們可以輕松地修改文字的樣式和位置。

當然，在實際應用中，我們可以根據需求添加更多的元素和樣式實現更加復雜的效果。總之，CSS 的圖片文字編輯功能使得我們可以更加輕松地創建時尚漂亮的網頁設計。希望這篇文章對您有所幫助。