I have a string of 30 characters
我有一个30个字符的字符串
I want to only display the first 10 followed by ...
我想只显示前10个,然后是......
so for example
所以例如
thisisastringthatis30characterslong
would become
thisisastr...
Is this possible using CSS?
这可能使用CSS吗?
Cheers!
2 个解决方案
#1
10
It´s called ellipsis and you can use it on a block element.
它被称为省略号,您可以在块元素上使用它。
However it does not work in Firefox and you cannot set the width to exactly 10 characters as you cannot specify the width in characters in css.
但是它在Firefox中不起作用,您无法将宽度设置为10个字符,因为您无法在css中指定字符宽度。
If you want exactly 10 characters and Firefox compatibility you will have to use javascript or a server-side solution.
如果你想要10个字符和Firefox兼容性,你将不得不使用javascript或服务器端解决方案。
#2
7
There is a CSS3 based solution text-overflow:ellipsis; claimed to be crossbrowser. But also it will show as many chars as fit, not exactly 10.
有一个基于CSS3的解决方案文本溢出:省略号;自称是crossbrowser。但它也会显示尽可能多的字符,而不是10。
#1
10
It´s called ellipsis and you can use it on a block element.
它被称为省略号,您可以在块元素上使用它。
However it does not work in Firefox and you cannot set the width to exactly 10 characters as you cannot specify the width in characters in css.
但是它在Firefox中不起作用,您无法将宽度设置为10个字符,因为您无法在css中指定字符宽度。
If you want exactly 10 characters and Firefox compatibility you will have to use javascript or a server-side solution.
如果你想要10个字符和Firefox兼容性,你将不得不使用javascript或服务器端解决方案。
#2
7
There is a CSS3 based solution text-overflow:ellipsis; claimed to be crossbrowser. But also it will show as many chars as fit, not exactly 10.
有一个基于CSS3的解决方案文本溢出:省略号;自称是crossbrowser。但它也会显示尽可能多的字符,而不是10。