在使用Chrome浏览器的情况下,以下CSS可以工作并显示省略号(红色突出显示),其结果如下所示:
铬:
position: relative;
display: -webkit-box;
max-height: 136px;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
结果:
但是在IE 11的情况下,它不会显示省略号:
谁能帮我解决此问题?
最佳答案
经过测试,似乎可以正常工作:https://jsbin.com/zaxasamoxa/1/edit
h1 {
width: 100px;
position: relative;
display: block;
display: -webkit-box;
max-height: 136px;
-webkit-line-clamp: 4px;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
<h1>absdfmksdlfmdlskflsdkfmlsdkmflskdmf</h1>
检查您的CSS是否有其他可能使我感到困惑的规则。
请注意,
display: -webkit-box;
将打破铬中的省略号。https://caniuse.com/#feat=text-overflow也确认了支持