CSS是設(shè)計(jì)網(wǎng)頁(yè)的重要工具之一，但是如果CSS中的寬度設(shè)置超出了頁(yè)面尺寸，會(huì)導(dǎo)致網(wǎng)頁(yè)布局混亂，影響用戶體驗(yàn)。下面我們來(lái)詳細(xì)探討這個(gè)問(wèn)題。

.example {
width: 120%;
}

如上所示的代碼，寬度設(shè)置為120%會(huì)導(dǎo)致元素的寬度超出原本的頁(yè)面寬度，這時(shí)候就會(huì)發(fā)生橫向滾動(dòng)條出現(xiàn)，導(dǎo)致用戶在瀏覽頁(yè)面時(shí)很不舒服。

為了避免這種情況發(fā)生，我們可以采用以下幾種方法：

1. 使用百分比或者em等相對(duì)單位來(lái)設(shè)置寬度。
2. 使用max-width屬性限制容器元素的最大寬度，這樣就不會(huì)超出頁(yè)面尺寸了。
3. 使用響應(yīng)式布局，在不同的屏幕尺寸下，自適應(yīng)調(diào)整寬度，避免出現(xiàn)滾動(dòng)條。

.example {
max-width: 100%;
}

如上所示的代碼，使用max-width:100%就能夠很好地解決這個(gè)問(wèn)題。這樣即使在不同的屏幕尺寸下，元素的寬度也不會(huì)超出頁(yè)面寬度，而且還能夠達(dá)到響應(yīng)式的效果。

總之，在CSS中設(shè)置寬度時(shí)，要特別注意不要超出頁(yè)面尺寸，避免影響網(wǎng)頁(yè)布局和用戶體驗(yàn)。