在移動設備上瀏覽網頁已經成為生活中不可或缺的一部分，因此如何確保網頁在手機上的良好顯示就顯得尤為重要。其中，設置頁面寬度是一個不可忽視的問題。 在 HTML 中，我們可以使用 meta 標簽來控制網頁的視口（viewport）。視口是指用戶在瀏覽器中可以看到的網頁區域，而 meta 標簽的主要作用就是告訴瀏覽器如何設置視口大小以及頁面的初始縮放比例。下面是一個設置視口寬度為設備寬度的例子：

<meta name="viewport" content="width=device-width, initial-scale=1">

其中， width=device-width 表示視口寬度等于設備寬度， initial-scale=1 表示初始縮放比例為 1。使用這個 meta 標簽，我們可以確保頁面寬度適配設備寬度，避免頁面出現滾動條和縮放等問題。 另外，我們還可以在 CSS 中使用 @media 查詢來針對不同的屏幕尺寸設置不同的樣式。例如，下面的代碼會在視口寬度小于等于 768px 時隱藏一個元素：

@media (max-width: 768px) {
p {
display: none;
}
}

在移動設備上調整頁面寬度可以讓用戶更加方便地瀏覽網頁，同時也能提升用戶體驗。因此，在開發移動端網頁時，我們可以結合 meta 標簽和 @media 查詢來設置頁面寬度，以確保網頁在不同設備上都能夠完美顯示。