1用js實(shí)現(xiàn)這樣的功能純粹就是浪費(fèi)性能，不劃算，最好用css來(lái)實(shí)現(xiàn)2用css設(shè)置超出省略非常簡(jiǎn)單 text width 300pxoverflow hiddenwhitespace nowraptextoverflow ellipsis 3如果你實(shí)在想用js來(lái)實(shí)現(xiàn)這樣；div width 100pxoverflowhiddentextoverflowellipsisdisplaywebkitboxwebkitboxorientverticalwebkitlineclamp2 3瀏覽器運(yùn)行indexhtml頁(yè)面，此時(shí)文字超過2行會(huì)自動(dòng)把多余部分用省略號(hào)顯示。

輸入CSS代碼，見下圖，轉(zhuǎn)到下面的步驟3第三步，執(zhí)行完上面的操作之后，瀏覽器運(yùn)行indexhtml頁(yè)面 如果此時(shí)文本超過2行，則多余的部分將自動(dòng)顯示為省略號(hào)，見下圖這樣，就解決了這個(gè)問題了；這個(gè)是因?yàn)樵O(shè)置了超出多少字符就省略號(hào)替換吧 你希望能全部看到信息 如果這是一個(gè)table 就把當(dāng)前這一列的td的樣式設(shè)置溢出部分滾動(dòng)條，或者自動(dòng) 這里面的內(nèi)容就不會(huì)省略了 但是如果是通過后臺(tái)獲取的 你需要和程序員溝通，不。

1默認(rèn)情況，它是自動(dòng)換行的2設(shè)置文字不換行whitespacenowrap，強(qiáng)行撐開3如果不希望容器被撐開，那就給文字加省略號(hào)ltstyle type=quottextcssquotdivbox width150px whitespacenowrap overflowhidden。

寬度自適應(yīng)的行內(nèi)塊元素ltp這里有很長(zhǎng)的文字這里有很長(zhǎng)的文字這里有很長(zhǎng)的文字這里有很長(zhǎng)的文字ltptextoverflow ellipsis 是變成省略號(hào)的選項(xiàng)，但其他屬性須存在才能達(dá)到想要的效果；能顯示完幾個(gè)字ltnobrltaltli ltul ltbody lthtml這是一個(gè)例子，也就是利用css的textoverflowellipsis 屬性進(jìn)行設(shè)置這可以做到內(nèi)文本溢出時(shí)顯示省略號(hào)，即起作用的是這一行 overflowhidden。

JS的這樣 lthtml ltscript function x var str=documentgetElementByIdquottd1quotinnerHTMLvar cd=strlengthifcd5documentgetElementByIdquottd1quotinnerHTML=strsubstring0，5+quotquot lt；有點(diǎn)麻煩，有幾個(gè)問題用css的textoverflow ellipsis顯示省略號(hào)IE貌似很好，但FF這賤狐貍精和其他某些賤瀏覽器不支持，只有用xxxaftercontentquotquot來(lái)添加省略號(hào)網(wǎng)上還有種方法是加個(gè)span里面用三個(gè)點(diǎn)的背景圖。

textoverflowellipsiswhitespacenowrapoverflowhidden在li里添加上這三句就行了，少加一條都不行這樣可以溢出省略號(hào)，要是直接讓它超出部分隱藏，就overflowhidden就可以的但是，上面給你的在FF上是沒有效果的；1給那個(gè)td加 textoverflowellipsis，和 whitespacenowrap 使td的內(nèi)容不換行，超長(zhǎng)出省略號(hào)2鼠標(biāo)hover上去顯示全 最簡(jiǎn)單的方法給那個(gè)td一個(gè)title屬性，屬性值是全部?jī)?nèi)容 hover上去自動(dòng)就有了，但不是圖上的那種。

這篇文章介紹的內(nèi)容是html如何只顯示部分td文字，有著一定的參考價(jià)值，現(xiàn)在分享給大家，有需要的朋友可以參考一下 可以直接這樣寫HTML如何讓table中的td內(nèi)容過長(zhǎng)顯示為固定長(zhǎng)度，多余部分用省略號(hào)代替 這個(gè)問題呢，是由于我們；單純的css只能實(shí)現(xiàn)一行顯示不下的時(shí)候顯示省略號(hào)，如果是多行的話，就需要用js實(shí)現(xiàn)了。

wordbreak breakalltextoverflow ellipsisdisplay webkitboxwebkitboxorient verticalwebkitlineclamp2overflow hidden你試試這段代碼， webkitlineclamp2這個(gè)是控制文本長(zhǎng)度；你可以點(diǎn)擊該鏈接，然后按快捷鍵ctrl+A就可以全選連接內(nèi)容，然后按ctrl+c就可以復(fù)制全部?jī)?nèi)容。