如何使用CSS解決文本溢出問題

這篇文章主要介紹了如何使用CSS解決文本溢出問題的相關(guān)知識，內(nèi)容詳細(xì)易懂，操作簡單快捷，具有一定借鑒價(jià)值，相信大家閱讀完這篇如何使用CSS解決文本溢出問題文章都會有所收獲，下面我們一起來看看吧。

成都創(chuàng)新互聯(lián)專注于涇源企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站開發(fā),商城開發(fā)。涇源網(wǎng)站建設(shè)公司,為涇源等地區(qū)提供建站服務(wù)。全流程按需定制制作，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，成都創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)

CSS

創(chuàng)建省略號后面的CSS非常簡單，包括寬度，包裝，溢出和文本溢出：

.dataTabletd{

/*essential*/

text-overflow：ellipsis;

width：200px;

white-space：nowrap;

overflow：hidden;

/*外觀漂亮*/

padding：10px;

}

設(shè)置寬度提供明顯的邊界，白色空間阻止正常的下一行換行，隱藏溢出確保寬度維度得到遵守，文本溢出設(shè)置提供省略號。太棒了吧？但是有一個(gè)問題......

Firefox和省略號

不幸的是，F(xiàn)irefox目前不支持文本溢出：省略號。DojoToolkit為Firefox提供了一個(gè)簡單的解決方案：dojox.html.ellipsis。此資源使用iFrame填充程序來創(chuàng)建省略號。以下是如何使用它：

//需要資源dojo。require（“dojox.html.ellipsis”）;

在需要JavaScript資源之后，是時(shí)候dojoxEllipsis在頁面中放置一個(gè)節(jié)點(diǎn)，表明dojox.html.ellipsis資源應(yīng)該對它進(jìn)行橢圓化：

Pellentesque居住者morbitristiquesenectusetnetusetmalesuada...