省略号选择元素不工作在IE9和Chrome [英] Ellipsis on select element not working in IE9 and Chrome
问题描述
我有一个具有指定宽度的选择列表。 text-overflow:ellipsis仅在Firefox v15中工作。它不工作与IE7-IE9和Chrome。是文本溢出:省略号支持IE7- IE 9和chrome?如果是,我在这里失踪了什么?有没有工作,得到类似的效果?请帮忙。提前致谢。下面给出Html
I have a select list with a specified width. text-overflow: ellipsis is working only with Firefox v15. It is not working with IE7-IE9 and Chrome. Is text-overflow : ellipsis supported in IE7- IE 9 and chrome? If yes, what am i missing here? Is there a work around to get a similar effect? Please help. Thanks in advance. Html is given below
<!DOCTYPE html>
<html>
<body>
<select style="white-space: nowrap;overflow: hidden;
text-overflow: ellipsis;width:70px;
">
<option>Volvooooooooooooo</option>
<option>Saabbbbbbbbbbbb</option>
<option>Mercedesaaaaaaaaaa</option>
<option>Audiiiiiiiiiiiiiii</option>
</select>
</body>
</html>
推荐答案
我认为text-overflow:在Chrome中将其放入select元素中时,您可以在此处查看示例: http://jsfiddle.net/t5eUe/
I think that text-overflow:ellipsis is not supported in Chrome when you put it into a select element, you can see an exemple here: http://jsfiddle.net/t5eUe/
您可以进行这种编程。例如,如果你使用Rails,你有函数truncate,如果你使用php,你有函数substr。
You can do this programming. For example, if you use Rails, you have the function "truncate", if you use php, you have the function "substr".
这篇关于省略号选择元素不工作在IE9和Chrome的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!