css設定文字不換行並顯示省略號

2022-02-24 03:13:40 字數 349 閱讀 9666

1、單行文字顯示省略號

width:value(具體的值);設定容器具體的寬度

white-spacing:nowrap;強制文字在一行內顯示

overflow:hidden;溢位內容為隱藏

text-overflow:ellipsis;溢位文字顯示省略號

2、多行文字顯示省略號

display:-webkit-box;

-webkit-box-orient:vertical;

overflow:hidden;

text-overflow:ellipsis;

-webkit-line-clamp:2;

CSS強制不換行 超出顯示省略號

強制不換行 p 自動換行 p 強制英文單詞斷行 p 注意 設定強制將英文單詞斷行,需要將行內元素設定為塊級元素。超出顯示省略號 pwhite space normal pre nowrap pre wrap pre line inherit white space 屬性設定如何處理元素內的空白 no...

css控制文字不換行且越界部分以省略號顯示

如下 這是一行文字,要求其在一行顯示,且越界部分以省略號顯示。效果圖如下所示 詳解 如果要實現此種樣式,關鍵的css屬性值有以下三個 text overflow overflow white space text overflow 規定當 文字溢位包含元素時發生的事情 語法 text overflo...

css 強制不換行,自動換行,超出顯示省略號

css 強制不換行,自動換行,超出顯示省略號 強制不換行 white space nowrap 自動換行 word wrap break word 強制英文單詞斷行 word break break all 注意 設定強制將英文單詞斷行,需要將行內元素設定為塊級元素。超出顯示省略號 text ove...