CSS 是一種用于網頁樣式設計的語言，可以方便地設置元素的外觀和排版。在設計移動端網頁時，我們可能會想要禁止網頁左右滑動，以提高用戶體驗。下面，我們就來講一講如何使用 CSS 實現這個效果。

首先，我們可以使用 overflow 屬性來控制元素是否可以滾動。這個屬性有 scroll、auto、hidden 和 visible 四個值，分別表示有滾動條、按需滾動、隱藏滾動條和默認情況。比如，我們可以將 body 的 overflow 設置為 hidden，使得整個頁面不能夠滾動：

body {
overflow: hidden;
}

但是，這樣設置后，我們可能會發現在某些情況下，比如頁面中有某個元素彈出模態框，模態框外面的元素依然可以滾動。

為了解決這個問題，我們可以給 body 添加 position: fixed，使其脫離文檔流，并且鋪滿整個視口。然后，再將整個頁面的高度設置為視口高度，這樣就可以避免滾動了。

body {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
html {
height: 100%;
}

這樣設置后，整個頁面就不能左右滑動了，但是上下滾動還是可以的。如果想要禁止上下滾動，我們可以使用 JavaScript 來監聽 touchmove 事件，然后阻止默認行為：

document.body.addEventListener('touchmove', function (event) {
event.preventDefault();
}, { passive: false });

這里的 { passive: false } 表示不使用默認的 passiva 行為，這樣可以防止在 iOS 上觸發彈性滾動。