省略号选择元素不工作在IE9和Chrome [英] Ellipsis on select element not working in IE9 and Chrome

查看:222
本文介绍了省略号选择元素不工作在IE9和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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆