div中文字內(nèi)容溢出常見的解決方法
由于文字內(nèi)容的長度不確定性和頁面布局的固定性,常常會(huì)遇到文字溢出的狀況,有一下解決方法:
1:規(guī)定文字父容器的寬高,設(shè)置超出隱藏:overflo:“hidde”
-------缺點(diǎn)是會(huì)經(jīng)常遇到最后一行文字顯示不全的情況,建議在只控制一行文字顯示的時(shí)候使用
2:css+div防止文字溢出,超出部分變成省略號(hào),折行顯示,white-space:nowrap;word-break:break-all; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow: hidden;
------缺點(diǎn)是火狐瀏覽器實(shí)現(xiàn)效果不好,會(huì)截?cái)?,頁面不是有很多需要隱藏,建議使用
3:用jQuery限制字符字?jǐn)?shù)
$(document).ready(function(){
//限制字符個(gè)數(shù)
$(“.word_overflow”).each(function(){
var maxwidth=23;
if($(this).text().length>maxwidth){
$(this).text($(this).text().substring(0,maxwidth));
$(this).html($(this).html()+'…');
}
});
});
以上就是本文的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助,同時(shí)也希望多多支持腳本之家!
相關(guān)文章
真正的JQuery.ajax傳遞中文參數(shù)的解決方法
許多人在使用JQuery.ajax方法時(shí)肯定會(huì)遇到一個(gè)問題。在編碼不是UTF-8的時(shí)候,當(dāng)傳遞的參數(shù)里有中文的時(shí)候,服務(wù)端Request的時(shí)候都會(huì)出現(xiàn)亂碼。2011-05-05
jQuery通過ajax請(qǐng)求php遍歷json數(shù)組到table中的代碼(推薦)
這篇文章主要介紹了jQuery通過ajax請(qǐng)求php遍歷json數(shù)組到table中代碼(推薦)的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
用jQuery實(shí)現(xiàn)抽獎(jiǎng)程序
這篇文章主要為大家詳細(xì)介紹了用jQuery實(shí)現(xiàn)抽獎(jiǎng)程序,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-04-04
JQuery對(duì)表格進(jìn)行操作的常用技巧總結(jié)
這篇文章主要介紹了JQuery對(duì)表格進(jìn)行操作的常用技巧,需要的朋友可以參考下2014-04-04
Query中click(),bind(),live(),delegate()的區(qū)別
這篇文章主要介紹了Query中click(),bind(),live(),delegate()之間的區(qū)別。需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-11-11
jquery 模擬雅虎首頁的點(diǎn)擊對(duì)話框效果
jquery模擬雅虎首頁的點(diǎn)擊對(duì)話框效果實(shí)現(xiàn)代碼,喜歡的朋友可以參考下。2010-04-04

