一些常用的html css整理 文字長度擷取

2022-07-29 09:51:12 字數 1018 閱讀 3314

div+css設定列表div超出部分顯示...(單行文字)

width:200px; //指定寬度:

overflow:hidden; //將超出內容隱藏

text-overflow:ellipsis; //文字溢位時顯示省略標記。

white-space:nowrap; //強制內容不換行。強制在同一行內顯示所有文字,直到文字結束或者遭遇 br 元素

現在的瀏覽器都支援text-overflow:ellipsis屬性,用來實現單行文字的溢位顯示省略號,但是這個屬性並不支援多行文字。

多行文字處理,**於

一、 -webkit-line-clamp

webkit支援乙個名為-webkit-line-clamp的屬性,他其實是乙個webkit-specific unsupported property,也就是說這個屬性並不是標準的一部分,可能是webkit內部使用的,或者被棄用的屬性。但是既然被人發現了,而且能用,為什麼不試試呢~o(∩_∩)o

p

這個我測試過的配合height的設定chrome正常,firefox沒有省略號。

二、-o-ellipsis-lastline不推薦使用,現在opera使用chrome相同的核心

從 opera 10.60 開始,text-overflow屬性有了乙個名為-o-ellipsis-lastline的值。應用後的效果就像名字一樣,在文字的最後一行加上省略號。這個方法比樓上的方法簡單多了,可惜也不在標準之內//(ㄒoㄒ)//
p

三、jquery未測試,相容性最強

除了各個瀏覽器私有的屬性,有沒有跨瀏覽器的解決方法呢?當然是通過js實現啦!(通過從後向前逐個刪除末尾字元,直至元素的高度小於父元素高度)

$(".figcaption").each(function

(i);

});

html css的一些筆記

絕對路徑 是從碟符開始的路徑 相對路徑 是從當前路徑開始的路徑 表示父目錄,上級目錄 css定位 靜態定位,絕對定位,相對定位,固定定位 絕對定位是相對於最近已定位的祖先元素,元素框從文件流完全刪除 它可以像圖層一樣單獨做一層,第幾層可以通過z index 來設定 相對定位是相對於正常排列的位置進行...

整理的一些常用系統表

名稱 位址 說明 sysaltfiles 主 儲存資料庫的檔案 syscharsets 主資料庫 字符集與排序順序 sysconfigures 主資料庫 配置選項 syscurconfigs 主資料庫 當前配置選項 sysdatabases 主資料庫 伺服器中的資料庫 syslanguages 主資...

整理的一些常用系統表

名稱 位址 說明 1sysaltfiles 主資料庫 儲存資料庫的檔案 2syscharsets 主資料庫 字符集與排序順序 3sysconfigures 主資料庫 配置選項 4syscurconfigs 主資料庫 當前配置選項 5sysdatabases 主資料庫 伺服器中的資料庫 6syslan...