CSS 頁面縮小后整體居中是網頁設計常見的技巧之一。無論是在手機端還是在電腦端，當瀏覽器窗口縮小的時候，頁面元素應自動居中。這不僅能使網頁看起來更美觀，也能提高用戶體驗。

.container{
width: 80%;
height: 500px;
margin: 0 auto;
}

這是一個簡單易懂的CSS樣式代碼，其中容器的寬度設置為 80%、高度設置為 500px，margin 屬性設置為 0 auto ，它是實現網頁縮小居中的關鍵部分。

其中，0 指設置上邊距和下邊距為 0，auto 指自動計算左右邊距，以使容器居中。這個方法也稱為水平居中技巧，可以應用于任何需要居中的容器，不管它們是多大。

如果您需要使元素在容器中水平并垂直居中，您可以使用 flexbox，即 CSS 彈性盒布局。以下是一些示例代碼：

.container{
display: flex;
justify-content: center;
align-items: center;
}

在這些代碼中，justify-content 和 align-items 屬性分別用于水平和垂直居中。

總之，CSS 頁面縮小后整體居中是重要的網頁設計技巧，它使得網頁看起來更美觀、易于使用，并大大提高了用戶體驗。