在網頁中，經常需要通過小標題對文章進行分割，使得文章更加清晰易讀。而使用 CSS 也可以很輕松地實現小標題分割并且對齊的效果。

在 HTML 中，通常使用 h1 - h6 標簽來表示標題。而對于小標題的分割，可以使用 h2 或 h3 標簽。我們可以這樣設置：

<h2>這是小標題1</h2>
<p>這是小標題1下的內容</p>
<h2>這是小標題2</h2>
<p>這是小標題2下的內容</p>
<h2>這是小標題3</h2>
<p>這是小標題3下的內容</p>

以上代碼是最基本的小標題分割方式。但是，這樣的樣式缺乏美觀性，沒有明顯的分界線。

下面我們來使用 CSS 為小標題添加樣式，使其更加美觀。

h2 {
margin-top: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #ccc;
}

以上 CSS 代碼的含義是：

• margin-top: 20px; 表示標題與上方的距離為 20px。
• padding-bottom: 10px; 表示標題下方的內邊距為 10px。
• border-bottom: 1px solid #ccc; 表示在標題下方添加一條 1px 寬度的灰色實線邊框。

通過以上 CSS 樣式的設置，我們就可以更加清晰易讀地展示小標題，并且使其視覺效果更顯眼。