只显示字符串的最后一部分

如何仅显示字符串的最后部分，如果它比我的div宽度没有换行符？例如“...string”，而不是只显示字符串的最后一部分

This is my 
very large string

UPD： This解决方案的工作，但是当我有一个大的字，例如url http://myhost/path/foo/bar?and=some&params=there只显示符号的一部分，不好。有任何想法吗？

来源

2016-02-16 Ilya

http://hugogiraudel.com/2014/12/16/css-riddle-reverse-ellipsis/ –

不用，它的作品，但不是在所有情况下。请参阅更新的问题以获取更多信息。 – Ilya

不，它是否可以在所有**案件中发挥作用。这不是标准的要求。 –

你可以做到这一点与direction: rtl;但它不会在Chrome工作

div { 
 
    white-space: nowrap; 
 
    padding: 0 10px; 
 
    width: 50px; 
 
    overflow: hidden; 
 
    text-overflow: ellipsis; 
 
    border: 1px solid #000000; 
 
    direction: rtl; 
 
}

<div>This is my 
 
very large string</div>

或者你可以使用JQuery的，并采取最后一个字从文字的p也宽度将是动态的，并适应最后一个词的宽度。

var part = $('p').text().split(' '); 
 
$('p').text('... '+part[part.length-1]);

p { 
 
    white-space: nowrap; 
 
    padding: 0 10px; 
 
    overflow: hidden; 
 
    display: inline-block; 
 
    border: 1px solid #000000; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p>This is my 
 
very large string</p>

来源

2016-02-16 12:50:01

不幸的是，我的用户大多使用Chrome（ – Ilya

@Ilya更新我的答案jQuery解决方案。 –

hmm似乎在2017年11月24日在Chrome中工作......这是否意味着顶级版本是推荐的方式？ JQuery的 –

只显示字符串的最后一部分

回答

相关问题