在移動端頁面開發中，打造好的 html 頁面經常需要適配多款手機尺寸，其中字體的適配也至關重要。通過 CSS 的設置，我們可以讓頁面在不同的手機屏幕上呈現出更適合的字體大小。

@media screen and (max-width: 768px){
html {
font-size: 14px;
}
}
@media screen and (min-width : 769px) and (max-width : 1024px){
html {
font-size: 16px;
}
}
@media screen and (min-width : 1025px){
html {
font-size: 18px;
}
}

上述代碼中，使用了 CSS3 中的 media query 功能來判斷不同的屏幕尺寸，設置不同大小的字體。這里我們以 768px、1024px 兩個尺寸為閾值進行調整，總體思路是在尺寸較小的手機上，字體大小要適度減小，屏幕尺寸越大，字體也要相應增大。

另外，對于各段落文字，我們可以采用 rem 單位來設置其字體大小，這樣可以更好地實現移動端的屏幕適配。要注意的是，需要動態計算 html 元素的 font-size 值，以適應不同的屏幕尺寸。

html {
font-size: 16px;
}
p {
font-size: 1rem; /* 意味著 16px（html font-size 的值） */
}

這樣的代碼就可以在各種手機尺寸下，都實現了較為完美的字體適配。通過合理的 CSS 設置，在移動端頁面設計中，我們可以達到更好的閱讀體驗和視覺效果。