在網頁設計中，經常會遇到一種情況，就是當文本內容超出了寬度時，網頁會自動換行。這時，我們可以使用CSS來控制文本內容的寬度，從而達到更好的展示效果。

p {
width: 200px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

上述代碼是一種經典的處理文本超出寬度的方法。首先，設置p標簽的寬度為200px，然后設置溢出隱藏，即當文本內容超出200px時，將自動隱藏。接著，設置文字不自動換行，也就是不管文本內容多長，都只在一行上顯示，直到遇到CSS樣式中所定義的寬度限制。最后，設置超出部分的文本內容以省略號表示，使其更顯得美觀。

除了以上說的ellipsis，text-overflow還有其他的屬性值：

• clip：文本超出部分被剪切掉
• string：文本超出部分用指定字符串代替

需要注意的是，當使用text-overflow屬性時，必須同時設置white-space: nowrap，否則該屬性不會生效。

除此之外，還可以使用CSS3的屬性flex來進行布局，如下：

.container {
display: flex;
overflow-x: scroll;
}
.item {
flex: 0 0 auto;
}

上述代碼中，我們將容器（.container）的屬性值設置為flex，使得子元素在其中可以自由調整大小與位置。同時，我們設置容器的溢出屬性為橫向滾動。然后，我們在每個子元素（.item）中設置一個flex: 0 0 auto，表示元素不會縮小或者放大，其寬度為其本身的大小。

總結來說，處理網頁文本超出寬度的方法有多種，上述代碼僅是其中的一部分，可以根據實際需求選擇適合自己的方法。