使用 WordPress 撰寫完整文章：含左右留白版面範例

副標題：示範整頁 HTML 版型與常用標籤

這個範例示範如何用一個 .page-wrapper 容器控制整篇文章的寬度， 讓左右有一致的留白，文章本身再透過各種 HTML 標籤排版內容。

一、標題階層示範

1.1 H3 小標題

這裡是一般段落文字，可以搭配 粗體 與 斜體 來強調重點。

1.1.1 H4 更細的標題

若內容很多，可再往下分層，但不建議層級過深以免閱讀困難。

二、列表與連結

常見列表用法：

• 無序清單項目一
• 無序清單項目二
• 無序清單項目三

1. 步驟一：登入後台。
2. 步驟二：建立新文章。
3. 步驟三：發佈並檢查前台顯示。

內文可以加入超連結，例如： 前往 WordPress 官方網站。

三、引用與圖片

好的版面會讓內容更容易閱讀，也更容易被使用者記住。

四、表格與程式碼

項目	說明
max-width	限制內容區最大寬度，避免在大螢幕上行寬過長。
margin: 0 auto	讓容器在視窗中水平置中，形成左右留白。

/* 關鍵版面 CSS 範例 */
.page-wrapper {
  max-width: 960px;
  margin: 40px auto;
  padding: 24px 32px;
  background-color: #ffffff;
}

五、結語

要在 WordPress 中做出「中間是文章、左右有留白」的版面，只要在 HTML 最外層包一個容器， 搭配 max-width 與 margin: 0 auto; 即可。文章內容則沿用標準的 H1～H6、 段落、列表等標籤來排版。