CSS”多餘文字省略號“的做法

如文字內容爲：

美國超級無敵大菠蘿

該選擇器的內容爲：
.goods{
width:20px;
font-size:15px;
//其他樣式省略
overflow:hidden; //將超出20px的多餘文字隱藏
white-space:nowrap; //文字不換行
text-overflow:ellipsis; //文字超出給省略號
}

最終在網頁中的呈現效果爲：
美國超級無…

歡迎有其他方法一起共享指正~~~