css – 如何在用户选择一个选项后扩展“选择”选项宽度

前端之家收集整理的这篇文章主要介绍了css – 如何在用户选择一个选项后扩展“选择”选项宽度前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
也许这是一个容易的问题,也许不是。我有一个选择框,我硬编码宽度。说120px。
<select style="width: 120px">
  <option>REALLY LONG TEXT,REALLY LONG TEXT,REALLY LONG TEXT</option>
  <option>ABC</option>
</select>

我想要显示第二个选项,以便用户可以看到文本的全长。

像其他一切这在Firefox中工作正常,但不能与Internet Explorer6一起使用。

解决方法

如果您使用< select>中的固定方式预先存在选项,并且不想以编程方式更改宽度,则可能会失去运气,除非您有一点创意。

>您可以尝试设置每个选项的title属性。这是非标准的HTML(如果您在此处关注此次轻微违规),但IE(以及Firefox)将在鼠标悬停的鼠标弹出窗口中显示整个文本。
>当用户选择某些东西时,您可以使用JavaScript来显示某些定位的DIV中的文本。 IMHO这是不太好的方式来做,因为它需要JavaScript来完成工作,只有在选择了某些东西之后,才能使用该选项。
>你根本不使用选择框,但是implement it’s functionality using other markup and CSS.不是我最喜欢的,但我想提到它。

如果您以后通过JavaScript添加一个长选项,请查看:How to update HTML “select” box dynamically in IE

猜你在找的CSS相关文章