CSS是一種用于設置網頁樣式的語言，而超出區域設置是其中一個重要的功能。

在日常的網頁開發中，我們經常會遇到內容過長，超過了父容器的大小，導致頁面樣式錯亂。為了解決這個問題，CSS提供了超出區域設置的相關屬性，如下:

.parent {
width: 200px;
height: 200px;
overflow: hidden; /*設置超出區域顯示規則*/
}
.child {
width:300px;
height: 300px;
}

在上面的代碼中，我們創建了一個父容器（class為parent）和一個子容器（class為child），并且給父容器設置了寬度和高度，同時設置超出區域的顯示規則為hidden。在子容器中，我們設置了寬度和高度，以便測試超出區域的效果。

當我們運行上面的代碼時，就會發現子容器的內容超出了父容器的范圍，但是由于我們設置了overflow:hidden，因此子容器超出的部分不會顯示出來，頁面樣式就不會錯亂。

除了overflow:hidden外，CSS中還提供了overflow:auto和overflow:scroll等設置超出區域顯示規則的屬性，可以根據實際需要來選擇不同的屬性。

總之，超出區域設置是CSS中非常重要的一個功能，可以幫助我們解決網頁樣式錯亂的問題。