在網頁設計中，CSS樣式的應用可以讓網頁更加美觀、易讀、易用。對于圖文排版來說，CSS樣式可以輔助實現圖片和文字之間的對齊、間距、大小等等。以下是添加CSS樣式圖文的具體示例：

<style>p {
margin-top: 30px;
margin-bottom: 30px;
line-height: 24px;
}
img {
display: block;
margin: 0 auto;
max-width: 100%;
}
</style><div><img src="example.jpg" alt="示例圖片"><p>這是一段示例文字，為了展示CSS樣式的運用效果，在這里加入隨機字母組成的文本：qwertyuiop[]asdfghjkl;'zxcvbnm,./1234567890-=`~!@#$%^&*()_+{}:"|<>?。</p></div>

首先，使用<style>標簽包裹CSS樣式代碼，其中p代表段落元素，img代表圖片元素。開頭的margin-top和margin-bottom分別指定了段落的上下與其他元素的距離，line-height則指定了行距。接下來的img部分則通過display: block來讓圖片單獨一行，margin: 0 auto則讓圖片水平居中，max-width: 100%則讓其不超出容器范圍。

最后，將圖片和文字分別放置在一個<div>標簽內即可，這也常常用于布局整個網頁。當然，這只是添加CSS樣式圖文的一個示例，具體的樣式和布局也需要根據實際需要進行調整。