如何實現css限制字數,超出部份顯示點點點滑鼠滑過顯示全部

2021-03-26 13:36:22 字數 1963 閱讀 9224

1樓:我命如天不如妖

差不多就這樣,你在調一調,主要就是text-overflow: ellipsis;

overflow: hidden;

white-space: nowrap;

這三個屬性!

2樓:幾多個你在夢中

試試看試試看試試看試試看試試看試試看試試看試試看試試看試試看試試看

語法:text-overflow : clip | ellipsis

引數:clip :  不顯示省略標記(...),而是簡單的裁切

(clip這個引數是不常用的!)

ellipsis :  當物件內文字溢位時顯示省略標記(...)

說明:設定或檢索是否使用一個省略標記(...)標示物件內文字的溢位。

請您注意,text-overflow:ellipsis屬性在ff中是沒有效果的。

示例:div

text-overflow是一個比較特殊的樣式,我們可以用它代替我們通常所用的標題擷取函式,而且這樣做對搜尋引擎更加友好,如:標題檔案有50 個漢字,而我們的列表可能只有300px的寬度。如果用標題擷取函式,則標題不是完整的,如果我們用css樣式text- overflow:

ellipsis,輸出的標題是完整的,只是受容器大小的侷限不顯示出來罷了。

text-overflow屬性僅是註解,當文字溢位時是否顯示省略標記。並不具備其它的樣式屬性定義。我們想要實現溢位時產生省 略號的效果。

還必須定義:強制文字在一行內顯示(white-space:nowrap)及溢位內容為隱藏(overflow:

hidden)。只有這樣 才能實現溢位文字顯示省略號的效果。

有的時候的某段文字太長了,會影響整個的佈局,很多人用動態語言來解決這個問題,但必須區分中文和英文,因為中文相當於兩個英文字元長度,這樣不僅繁瑣,而且加重了伺服器的負擔。其實,我們完全可以使用css完美解決這個問題,

怎麼實現css限制字數,超出部份顯示點點點

3樓:千鋒教育

width:150px;/*要顯示文字的寬度*/overflow:hidden; /*超出的部分隱藏起來。

*/ white-space:nowrap;/*不顯示的地方用內省略號容...代替*/text-overflow:

ellipsis;/* 支援 ie */

css中如何使滑鼠經過過長文字(溢位部分已隱藏為省略號)時全部顯示下劃線(包括省略號在內),如圖所示:

4樓:匿名使用者

有點麻來煩,有幾個問題:

用css的自text-overflow: ellipsis;顯示省略號ie貌似很好,但

baiff這賤狐du狸精和其他某些賤瀏覽器zhi不支援,只有用dao***:after來新增省略號。網上還有種方法是加個span裡面用三個點的背景圖來模擬省略號,而你上傳的圖應該是ps的你想要的效果,但看不出來你是通過什麼方式弄的省略號出來?

這個問題我沒寫**在幾個瀏覽器下實測,只是腦袋裡面大概想了下,估計要是用text-decoration下劃線的方式來搞定幾大核心,同時實現a:hover狀態連結和省略號都帶下劃線有可能做不到。

你只有試試把a定義成display:block塊級元素後看省略號的點範圍是不是算在塊的長度裡面的,是的話就好辦,用1px的橫線背景圖(長度剛好跟省略號長度一樣)來實現。當a:

hover時出現這個背景圖居下、右對齊不重複就行了。

如果a定義塊級後,省略號不是算在塊裡面的,基本上純css你的問題是無解了,你只有考慮結合js。

另外你這個要求本身意義不大,這種無關緊要的小細節不必花時間去搞

5樓:匿名使用者

多套一層span a:hover span 試試吧在span上做省略號

6樓:匿名使用者

下面的做法可以來給您一些提示自

古古怪怪給剛剛反反覆覆方法快快快太容易

在css中如何實現滑鼠移上去後,字型變顏色

你說的這一個軟體中想要舒適不要的移動來體驗字型的變化就需要設定出這樣一個特殊的模式就可以了 參照以下 寫在標籤內的滑鼠經過的語句。查詢更多 bordercolor之類的前面一定要有style,因為是改變行內樣式,如果是classname就不用,如onmouseout this.style.一定要 u...

css3 漸變怎麼實現,CSS3怎麼做出過渡漸變效果

針對不同瀏覽器有不同的字首,基本還是相似的,下面的意思是線性漸變,從上方開始,從黑色漸變到白色 webkit linear gradient top,000,fff moz linear gradient top,000,fff o linear gradient top,000,fff 也可以加一...

勸說踩踏草坪作文800子字數限制

一年級的時copy候,我可喜歡草坪了,一見到它,就往它身上一躺,真舒服。一天又一天地過去了,突然有一天我覺得小 起以前不再那麼柔軟了。我想 小草可能餓了,所以才不柔軟了吧。這時候媽媽意味深長地說 你看,你每天都往它身上躺著,小草都不柔軟了,小草它也是有生命的,它也會疼。知道嗎?我連聲說到 知道了,知...