問(wèn)題描述

1.p中的內(nèi)容過(guò)長(zhǎng)，當(dāng)內(nèi)容過(guò)長(zhǎng)，超過(guò)兩行的顯示時(shí)，出現(xiàn)一個(gè)【展示】標(biāo)簽，展開(kāi)之后內(nèi)容最后面出現(xiàn)【收起】標(biāo)簽，類(lèi)似于QQ空間發(fā)表的說(shuō)說(shuō)，長(zhǎng)了顯示全文，完了還可以收起來(lái)的效果，我做的無(wú)法判斷內(nèi)容長(zhǎng)度，而且一行中顯示的中英文字?jǐn)?shù)是不等的，想有個(gè)效果完整的例子看看。

問(wèn)題解答

我給個(gè)思路，html在文字后面加個(gè)inline-block(你的展開(kāi)和關(guān)閉)。css設(shè)置固定高，超出后overflow:hidden。js判斷高度，超過(guò)后最外層加一個(gè) class,這個(gè) class控制你的展開(kāi)和關(guān)閉，還有清除固定高和overflow：hidden。當(dāng)然如果是響應(yīng)式得另外想辦法。

angular filter

使用line-height指定高度，通過(guò)這個(gè)高度來(lái)實(shí)現(xiàn)收起拉伸