如何隱藏div
或span
裏面的部分文字?隱藏部分文字html,css,javascript
我有160個字符的文本,但我想只顯示第40
我必須有完整的文字我div
內,span
像我一樣的JavaScript搜索。
如何隱藏div
或span
裏面的部分文字?隱藏部分文字html,css,javascript
我有160個字符的文本,但我想只顯示第40
我必須有完整的文字我div
內,span
像我一樣的JavaScript搜索。
您將需要一些javascript來創建隱藏它們的最後120個字符的範圍。有一個CSS屬性「visibility:hidden」,可以應用於span。
類似的東西應該是結果:
<div>first 40 chars <span style="visibility:hidden">last 120 chars</span></div>
如果你想在div夾到一定的規模,而不是人物的一個確切的數字,你可以給DIV你想要的大小和指定overflow: hidden
來裁剪不適合的內容。
如果確保div的高度是文本的多行高度,則不會將內容剪切到一行的(垂直)中間。
您可以對元素使用簡單的css屬性「text-overflow:ellipsis;」 要有效使用此屬性,您需要應用一些相關的屬性。
例如:
<div style="width: 50px; text-overflow: ellipsis; white-space: nowrap;
overflow: hidden;">Some text goes here</div>
*測試在瀏覽器。
這是純粹的魔法。 – fiatjaf 2015-04-07 14:19:12
這引出了一個問題:「我如何找到前40個字符?」(假設這不是靜態HTML) – 2012-03-14 10:37:18
@Madmartigan如果它不是靜態HTML,則可以在生成頁面上的服務器。在PHP或ASP中不應太難。使用JQuery也很容易。 – GolezTrol 2012-03-14 11:02:32