If I understand your issue correctly, this might work for you:
.container {
width:120px;
background: lightgray;
}
.text {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
color:#b02b7c;
}
.color {
color: black;
}
<div class="container">
<div class="text"><span class="color">Lorem</span> ipsum dolor sit amet, consetetur
</div><!-- works -->
</div>
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…