css中溢位一行顯示省略號這個省略號可以改顏色嗎

2021-04-14 14:42:53 字數 4269 閱讀 2493

1樓:流熙凌

divspan

顯示省bai

略號,但是省略號顏色du不同(就是再套一層zhidiv,給div設定dao省略號)版就能單獨設定父子二者顏權色。希望對你有幫助

2樓:張_涵_冰

這個省略號是文字後面的麼?如果是的話,就同文字的樣式是一樣的

想用css做一個文字在兩行顯示 有固定寬高 超出顯示省略號 我看的用強制一行的可以顯示省略號兩行就不行了 5

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

3樓:匿名使用者

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

用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。

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

4樓:匿名使用者

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

5樓:匿名使用者

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

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

css 一段文字怎麼設定超過省略號顯示

6樓:加百列

單行文字實現方法:

實現效果:

多行文字溢位顯示省略號實現方法:

實現效果:

適用範圍:

因使用了webkit的css擴充套件屬性,該方法適用於webkit瀏覽器及移動端;

7樓:劍指長空明德

通常的做法是這樣的:

1、white-space:nowrap;

2、width:100%;

3、overflow:hidden;

4、text-overflow:ellipsis;

5、-o-text-overflow:ellipsis;

還可以通過新增一個-webkit-line-clamp的私有屬性來實現,-webkit-line-clamp是用來限制在一個塊元素顯示的文字的行數。 為了實現這個效果,它需要組合其他的webkit屬性:

display: -webkit-box 將物件作為彈性伸縮盒子模型顯示;

-webkit-box-orient 設定或檢索伸縮盒物件的子元素的排列方式;

text-overflow: ellipsis 用省略號「…」隱藏超出範圍的文字。

具體**參考如下:

overflow : hidden;text-overflow: ellipsis;display:

-webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;

擴充套件資料

適用範圍:

該方法適用範圍廣,但文字未超出行的情況下也會出現省略號,可結合js優化該方法。

將height設定為line-height的整數倍,防止超出的文字露出。

給p::after新增漸變背景可避免文字只顯示一半。

由於ie6-7不顯示content內容,所以要新增標籤相容ie6-7(如:…);相容ie需要將::after替換成:after。

8樓:灰常了

首先你容納文字的容器要設定固定的寬高,然後加上以下屬性white-space: nowrap;

word-break: keep-all;

text-overflow: ellipsis;

第一行的**,是不允許文字換行

第二行的**,是不允許把單詞拆開

第三行的**,就是文字超出容器,以省略號顯示望採納!

9樓:匿名使用者

樣式控制也可以實現的,偏方

首先這個多行是高度寬度

固定的,比如高度是100;寬度200

這裡是內容內容這裡是內容內容這裡是內容內容這裡是內容內容……這個方法是隱藏了多餘的文字,實際上文字不會少,只是給使用者看到的跡象是多的用省略號代替了,這樣的好處是利用seo,壞處是當文字不夠多的話,那就露餡了

10樓:七月的下雨天

我可以肯定的告訴你,想用css的方法做多行文字最後省略號,相容所有瀏覽器,是不可能的。

11樓:匿名使用者

我也想用css來控制多行超出用省略號表示,如果css你會的話,可以教我。如果不會,我可以教你用js或者jquery解決你的問題

12樓:玄魂玉

從來都是根據字元數動態擷取的,或使用js;純css做不到

13樓:子凡

overflow: hidden;

white-space: nowrap;

text-overflow: ellipsis;

//首先這隻它的寬度然後把上面的屬性copy進去

css中怎麼讓超出塊的文字顯示為省略號

14樓:我命如天不如妖

首先設定這個包裹文字元素的標籤為塊狀元素,之後在確定寬度,之後加上overflow:hidden;

text-overflow:ellipsis;

white-space:nowrap;

15樓:匿名使用者

設定其text-overflow為ellipsis,強制不換行,及其寬度。如:

這是內回容答這是內容這是內容這是內容這是內容這是內容

16樓:理想

用php檢索,然後代替

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

17樓:我命如天不如妖

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

overflow: hidden;

white-space: nowrap;

這三個屬性!

18樓:幾多個你在夢中

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

語法: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完美解決這個問題,

省略號和破折號在一行的末尾時,可以提行到第二行的開頭嗎

略號和破折號書寫時都放在字格中部,佔兩個字格。它們可以出現在一行的開頭,也可以出現在一行的末尾,但不能拆散使用,即不能出現前行未尾佔一格,後行開頭佔一格的情況。破折號的用法 中文破折號 長度佔兩個字的位置,用途廣泛。首先用來引出解釋說明的語句,其次用來表示語意的突然轉折和聲音延長等。省略號的用法 省...

短文最後一句話中的省略號省略了哪些內容?請你試著寫一寫

姐姐,姐姐,飛上去了,飛上去了!弟弟蹦跳著拍手叫好。我望著在天窮飛翔的風箏,暗暗自豪了一下,我就說嘛,放風箏這種事特簡單。姐姐最厲害了。抬頭仰望著我。回過頭看到他那崇拜的眼神,好不客氣的回答 那是,也不看看我是誰!短文最後一句話中的省略號省略了哪些內容?請你試著寫一寫。我好像變成了一隻小鳥,去看祖國...

北風乍起時短文第一自然段中的省略號表示

今年的冬天格外 復冷,我也制格外寂寞。我 一邊bai取暖,一du邊看著電視,我驚奇的發現zhi天氣預dao報說武漢將會有北風襲擊,我十分著急,趕緊打 給爸爸,著急地說 等一會,將會有北風襲擊,你要多穿點衣服呀 說完,爸爸便不緊不慢地對我說 不會有事的,我這還暖和著呢,等寒潮真正降臨了再說吧 接著便掛...