在實際應(yīng)用中，經(jīng)常需要只顯示一行文字，不允許文字換行破壞整體樣式的情況。
例如’商品的名稱’，’簡介’等等。但是由于顯示器的寬度不一樣，會出現(xiàn)后臺所給文字內(nèi)容，
一行文本容納不下的情況。溢出的文本如果使用overflow:hidden生硬的給隱藏掉，
顯示的效果不是很好，這時，溢出的文本就需要使用省略號...來替換。使用js截取有點兒復(fù)雜，
可直接使用css的屬性進(jìn)行設(shè)置，實現(xiàn)該效果。

　　需給文本對象添加的css屬性如下：

<p class="className">休閑純色百搭短褲</p>

.className{width: 60px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

顯示的效果如下：