Html 文本溢出：当内容太短时，省略号将不起作用
一个非常简单的问题，但我还没有找到答案 有一个带文本的divHtml 文本溢出：当内容太短时，省略号将不起作用,html,css,Html,Css,一个非常简单的问题，但我还没有找到答案 有一个带文本的div <div class="hkb">Revenue</div> 然后问题来了： 将宽度值更改为36px，输出显示“R…”，这是正确的，因为“Revenue”的真实宽度为36px-2*8px=20px 将width值更改为28px，输出显示“…”，也应为28-2*8=12 将宽度值更改为27或更低，输出将显示“Rev”，“Revenue”的真实宽度为27px-2*8px=11px，可能宽度不够长，无法容纳文本，因
<div class="hkb">Revenue</div>
以下是。文本溢出：省略号属性所需的总和宽度。请尝试
<body>
<div class="hkb">Revenue</div>
</body>
.hkb{
width: 40px;
height: 15px;
line-height: 11px;
font-size: 8px;
overflow: hidden;
text-overflow: ellipsis;
padding: 5px 8px;
box-sizing: border-box;
white-space: nowrap;
}
收入
.hkb{
宽度：40px；
高度：15px；
线高：11px；
字号：8px；
溢出：隐藏；
文本溢出：省略号；
填充：5px 8px；
框大小：边框框；
空白：nowrap；
}
Live听起来像是一个浏览器怪癖？你的小提琴至少能在Chrome中产生
“…”2427省略号的宽度大于包含元素有关（如果包含元素小于省略号，则显示剪裁文本？）是的，我只想知道省略号更改为在不同浏览器中剪裁的阈值，不同字体大小，以及其他一些因素
<body>
<div class="hkb">Revenue</div>
</body>
.hkb{
width: 40px;
height: 15px;
line-height: 11px;
font-size: 8px;
overflow: hidden;
text-overflow: ellipsis;
padding: 5px 8px;
box-sizing: border-box;
white-space: nowrap;
}