在移動端開發過程中，不同的設備會有不同的屏幕大小和分辨率。為了讓網頁在不同設備上有更好的顯示效果，我們需要進行 CSS 的適配。特別是在 iOS 和 Android 兩大主流操作系統上，為了保證用戶體驗，我們需要對不同的設備做出適配。

一般來說，我們可以使用media query來實現對屏幕尺寸的判斷。同時，我們還可以通過vw和vh等單位來適應不同的屏幕分辨率。

/* 判斷 iPhone */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-device-pixel-ratio: 2) {
}
/* 判斷 iPad */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-device-pixel-ratio: 2) {
}
/* 使用 vw 適配屏幕 */
body {
font-size: 16px;
}
@media only screen and (min-width: 320px) {
body {
font-size: 4vw;
}
}
@media only screen and (min-width: 768px) {
body {
font-size: 2vw;
}
}

另外，在使用 CSS 做適配的時候，需要注意以下幾點：

• 避免使用絕對定位和固定尺寸
• 選擇字體時要考慮中英文字符的寬度差異
• 避免使用過多的層疊樣式
• 盡量使用簡單的布局結構

最終，通過對不同設備進行 CSS 適配，我們可以為用戶提供更好的瀏覽體驗。