在移動設備上，屏幕的尺寸和分辨率是千差萬別的。為了給用戶提供更好的體驗，我們需要使用 JavaScript 和 CSS 來適配不同大小的屏幕。

1. 使用 CSS 媒體查詢

@media (max-width: 767px) {
body {
font-size: 14px;
}
}

上面的代碼使用 CSS 媒體查詢，如果屏幕的寬度小于 768 像素，就將 body 元素的字體大小設置為 14 像素。同樣的，我們可以針對不同的屏幕尺寸設置不同的 CSS 樣式。

2. 使用 JavaScript 動態設置 CSS 樣式

var screenWidth = window.innerWidth;
var cssStyle = document.createElement("style");
if (screenWidth< 768) {
cssStyle.innerHTML = "body { font-size: 14px; }";
} else {
cssStyle.innerHTML = "body { font-size: 16px; }";
}
document.head.appendChild(cssStyle);

上面的代碼使用 JavaScript 獲取屏幕的寬度，然后動態創建一個 style 元素，根據屏幕寬度設置不同的 CSS 樣式。

通過以上兩種方式，我們可以根據不同的屏幕尺寸為用戶提供更好的視覺效果和用戶體驗。