怎么用css截取字符?
問題描述
怎么用css截取字符?
問題解答
回答1:怎么用css截取字符?-PHP中文網問答-怎么用css截取字符?-PHP中文網問答
圍觀一下哦,學習一下。
回答2:方法一:
<p style="width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;"> 任意長度的字符串 </p>
說明:優點是內容可以為任何HTML元素,包括超鏈接和圖片等,在IE6中還會在結尾自動顯示省略號。缺點是必須指定寬度數值,并且寬度不能是百分數,否則在IE中會被認為是字符總長的百分比。
方法二:
<input type="text" style="width:100%; cursor:default; border-width:0; border-style:none; background-color:transparent;" value="任意長度的字符串" readonly/>
說明:優點是寬度可以設為百分數。但缺點是內容只能為純文本,不能有超鏈接等內容。
CSS是實現文字自動截斷,代碼如下:
p.test{ width:200px; height:14px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-overflow: ellipsis;/* IE/Safari */ -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis;/* Opera */ -moz-binding: url("ellipsis.xml#ellipsis");/*FireFox*/}
用text-overflow的最佳場所不是文章的行文,而是用以單行顯示的標題或摘要的列表。
相關文章:
1. 如何解決docker宿主機無法訪問容器中的服務?2. javascript - 如何使用nodejs 將.html 文件轉化成canvas3. angular.js - 輸入郵箱地址之后, 如何使其自動在末尾添加分號?4. javascript - html5的data屬性怎么指定一個function函數呢?5. 在mac下出現了兩個docker環境6. python - Scrapy存在內存泄漏的問題。7. java如何生成token?8. docker-compose中volumes的問題9. javascript - 后臺管理系統左側折疊導航欄數據較多,怎么樣直接通過搜索去定位到具體某一個菜單項位置,并展開當前菜單10. javascript - Web微信聊天輸入框解決方案
