使用CSS分割頁面，可以讓頁面更加美觀、清晰，而且用戶也能更加方便地找到所需要的內容。

為了實現這個效果，我們需要使用CSS中的float屬性來編寫樣式代碼。首先，我們需要設置一個分割線的樣式，可以使用以下代碼：

.hr {
border: none;
border-top: 1px solid #ccc;
margin: 20px 0;
}

接下來，我們可以將需要分割的內容使用p標簽進行包裹，并設置float屬性，使其靠左或者靠右對齊。例如：

<p class="float-left">左側內容</p>
<p class="float-right">右側內容</p>
<div class="hr"></div>

這樣，左側和右側的內容就會分別靠左和靠右對齊，并在它們之間添加一條分割線。如果需要添加多個分割線，只需要再添加相應的div元素即可。

除了使用float屬性，我們還可以使用CSS中的flexbox和grid布局來實現頁面分割效果。不過，在使用這兩種布局前，需要先了解它們的基本用法和特點。