Question

我在HTML中使用Bootstarp下拉列表。如何实现select HTML标记的相同溢出行为，我添加了一个代码段。

由于项目的复杂样式（图像和按钮），我无法使用选择。

我在winform应用程序中的Web Broser Control中托管html。在html下面还有其他C＃Control，如果我使用select标签，它会隐藏项目。我添加此信息只是为了解释我的问题（可以使用Iframe标记解释相同的行为）。

注意：如果你这样做，请确保最小化窗口以实现溢出复制这个HTML。

点击此处查看desirable Select behavior。

点击此处查看comparison between the controls

提前致谢

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
	<body>
		<div class="dropdown">
		<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">click me
		<span class="caret"></span></button>
		<ul class="dropdown-menu">
		  <li>AAA</li>
		  <li>BBB</li>
		  <li>CCC</li>
		  <li>DDD</li>
		  <li>EEE</li>
		  <li>AAA</li>
		  <li>BBB</li>
		  <li>CCC</li>
		  <li>DDD</li>
		  <li>EEE</li>
	  <li>AAA</li>
	  <li>BBB</li>
	  <li>CCC</li>
	  <li>DDD</li>
	  <li>EEE</li>
	  <li>AAA</li>
	  <li>BBB</li>
	  <li>CCC</li>
	  <li>DDD</li>
	  <li>EEE</li>
		</ul>
		</div>
		<select style="position: fixed; left: 200px; top:0px;">
			<option>click me too</option>
			<option>BBB</option>
			<option>CCC</option>
			<option>DDD</option>
			<option>EEE</option>
			<option>AAA</option>
			<option>BBB</option>
			<option>CCC</option>
			<option>DDD</option>
			<option>EEE</option>
			<option>AAA</option>
			<option>BBB</option>
			<option>CCC</option>
			<option>DDD</option>
			<option>EEE</option>
			<option>AAA</option>
			<option>BBB</option>
			<option>CCC</option>
			<option>DDD</option>
			<option>EEE</option>
		</select>
		<div style="color:red; font-weight:bold;">If you copy this html, minimize the window size before testing behavior<div>
	</body>
</html>

Answer 1

替换它，

<select class="form-control" style="position: fixed; left: 200px; top:0px;">

如何在bootstrap下拉列表中实现select标签溢出行为

1 个答案: