国产色在线视频-国产色综合一区二区三区-国产身材极品喷水 在线播放-国产深夜福利视频观看-国产深夜福利视频在线-国产深夜福利视频在线播放

css限制單行文本輸入,超出部分使用...替換

2016/11/30 8:30:05   閱讀:1520    發(fā)布者:1520

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

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

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

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

顯示的效果如下: