我需要构建一个多行选择控件.所有<option>的地方文本的宽度大于300像素(例如)成为有必要的行不超过提到的上限.
这些图像不言自明:

首先我尝试了这个,但是没有用.
<html>
<head>
<style>
option{
width: 100px;
white-space: wrap;
}
</style>
</head>
<body>
<select>
<option>I'm short</option>
<option>I'm medium text</option>
<option>I'm a very very very very very very very very very long text</option>
</select>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我正在使用bootstrap框架,我想也许我可以使用下拉控件来获取结果.我已经尝试设置max-width CSS属性,但它也不起作用......
我怎样才能做到这一点?
有没有办法在元素中有多行<option>?
像这样:
-------------------------
| Normal <option> element |
-------------------------
| <option> element broken |
| onto two lines |
-------------------------
| Normal <option> element |
-------------------------
Run Code Online (Sandbox Code Playgroud)
有没有HTML/CSS方法,还是我应该使用JavaScript?
我想在我的页面上放一个下拉列表,由于一个选项太长,当我单击选择菜单时,它将展开并覆盖页面的其他部分.
<select id="selectlist" name="SelectProgram">
<option value="LIR" >LIR</option>
<option value="How to word wrap text in HTML?">How to word wrap text in HTML? CSS / HTML text wrap for webkit</option>
Run Code Online (Sandbox Code Playgroud)
第二个选项太长,会扩展.有什么方法可以把这么长的文字换成2行吗?谢谢!