bootstrap的bootstrap-select插件的使用问题

我在使用bootstrap-select插件的时候框总是会变得很细，如下图：

这是我的代码，求大神指教！！！

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>


<%
	pageContext.setAttribute("APP_PATH", request.getContextPath());
%>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- jquery -->
<script type="text/javascript"
	src="${APP_PATH}/static/js/jquery-1.11.3.min.js"></script>
<!-- Bootstrap -->
<link
	href="${APP_PATH}/static/bootstrap-3.3.7-dist/css/bootstrap.min.css"
	rel="stylesheet">

<script
	src="${APP_PATH}/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!-- Bootstrap-select -->
<link rel="stylesheet"
	href="${APP_PATH}/static/bootstrap-select-1.13.2-dist/css/bootstrap-select.min.css">

<script
	src="${APP_PATH}/static/bootstrap-select-1.13.2-dist/js/bootstrap-select.min.js"></script>
	
	<script src="${APP_PATH}/static/bootstrap-select-1.13.2-dist/js/i18n/defaults-zh_CN.min.js"></script>
<title>评分页面</title>
</head>

<body>


 
	<h1>学生评分</h1>
	hello,${user.uName }!
	
	<div class="col-xs-12">
		<select class="selectpicker" data-live-search="true">
			<option data-tokens="ketchup mustard">Hot Dog, Fries and a Soda</option>
			<option data-tokens="mustard">Burger, Shake and a Smile</option>
			<option data-tokens="frosting">Sugar, Spice and all things nice</option>
		</select>
	</div>
	
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<select class="form-control input-lg" width="50px">
		<option data-tokens="ketchup mustard">Hot Dog, Fries and a Soda</option>
		<option data-tokens="mustard">Burger, Shake and a Smile</option>
		<option data-tokens="frosting">Sugar, Spice and all things nice</option>
	</select>
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<select class="selectpicker">
		<optgroup label="Picnic">
			<option>Mustard</option>
			<option>Ketchup</option>
			<option>Relish</option>
		</optgroup>
		<optgroup label="Camping">
			<option>Tent</option>
			<option>Flashlight</option>
			<option>Toilet Paper</option>
		</optgroup>
	</select>



</body>
</html>

0个评论

1个牛币 bootstrap bootstrap插件问题

所有回答列表(1)

renkai721 LV4 2019年7月9日

这个很明显是哪个js控制了select的高度导致的。添加以下代码试试，看有没有变化。

<style>

select{

height:30px !important;

}

</style>

最热评论
最新问答