span標簽設置文字超過后顯示省略號

想設置span標簽超過一定寬度后隱藏，多余的部分顯示省略號，發現設置了寬度和overflow后不起作用，度娘后，發現少了個屬性

.list .list-item .title {
width: 250px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: inline-block;
}

主要少了紅色背景這句，網上的解釋：這是因為span標簽屬於行內元素（inline），所以無法設置高度和寬度；如果需要改變其寬高，就需要將其轉變為塊體元素（block）或行內塊體元素（inline-block）。