CSS3省略號剪切字符串結尾不同的字符

Question

我有以下CSS代碼;

同一問題在另一個問題中報告爲here，但沒有回答。

span { 
    text-overflow: ellipsis; 
    overflow: hidden; 
    white-space: nowrap; 
    white-space: nowrap\9; 
    overflow: hidden\9; 
    display: inline-block; 
    line-height: normal; 
    width: 83%; 
    width: -webkit-calc(100% - 65px); 
    width: calc(100% - 65px); 
    width: -moz-calc(100% - 65px); 
    vertical-align: middle; 
} 

HTML

<h1><span>ZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZ</span></h1> 

截圖也被添加爲好，證明問題。

Answer 1

在https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow你可以閱讀：

省略此關鍵字的值表示顯示一個省略號（ '...'， U + 2026水平省略）來表示剪切文本。省略號爲 顯示在內容區域內，減少顯示的文字數量 。如果沒有足夠的空間來顯示省略號，則它是 限幅。

所以我希望你的省略號已被剪裁（沒有足夠的空間，因爲你的字符串沒有空格）。出於這個原因，我也認爲text-overflow: ellipsis is displaying different character描述了一個不同的問題。