隨著智能手機的流行，越來越多的人使用手機瀏覽網頁。而網頁自適應手機屏幕尺寸的需求也變得越來越重要。HTML5成為了現代網頁設計的主流技術之一，也提供了方便的手機自適應代碼。

//在HTML頭部添加如下代碼，設置viewport元數據
<meta name="viewport" content="width=device-width, initial-scale=1.0">
// 在CSS中設置網頁寬度為100%，并使用媒體查詢
body {
width: 100%;
}
@media (min-width: 768px) {
// 在高于768像素的屏幕寬度中使用規則
body {
width: 768px;
}
}

首先，在HTML的頭部添加meta視口元數據，這樣可以讓瀏覽器以設備的實際屏幕寬度自動調整網頁布局。這個元數據告訴瀏覽器使用設備的寬度作為頁面寬度，并且初始縮放比例要設為1.0。

接下來，在CSS樣式表中設置網頁整體寬度為100%，這樣就實現了讓頁面寬度自適應設備。然后使用媒體查詢，指定在屏幕寬度大于768像素時，網頁寬度設為768像素，達到更好的顯示效果。

通過如上代碼，HTML5為你提供了簡單易懂的手機自適應代碼，讓你的網頁在各種設備上呈現更佳的可讀性和體驗。